ChatGPT UP DOWN buttons

up/down buttons for chatgpt

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey, Greasemonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да инсталирате разширение, като например Tampermonkey .

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Userscripts.

За да инсталирате скрипта, трябва да инсталирате разширение като Tampermonkey.

За да инсталирате този скрипт, трябва да имате инсталиран скриптов мениджър.

(Вече имам скриптов мениджър, искам да го инсталирам!)

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

(Вече имам инсталиран мениджър на стиловете, искам да го инсталирам!)

// ==UserScript==
// @name         ChatGPT UP DOWN buttons
// @namespace    http://tampermonkey.net/
// @version      2026-07-25
// @description  up/down buttons for chatgpt
// @author       Johann Nather
// @match        https://chatgpt.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=chatgpt.com
// @grant        none
// @license      GNU GPLv3
// ==/UserScript==
(function () {
    "use strict";

    // Mehrfaches Einfügen verhindern
    if (document.getElementById("chat-scroll-buttons")) return;

    // Chat-Container suchen
    function getScrollContainer() {
        let best = document.scrollingElement;
        let maxScroll = 0;

        document.querySelectorAll("*").forEach((el) => {
            const style = getComputedStyle(el);

            if (
                (style.overflowY === "auto" || style.overflowY === "scroll") &&
                el.scrollHeight > el.clientHeight + 50
            ) {
                const scroll = el.scrollHeight - el.clientHeight;
                if (scroll > maxScroll) {
                    maxScroll = scroll;
                    best = el;
                }
            }
        });

        return best;
    }

    function scrollTop() {
        getScrollContainer().scrollTo({
            top: 0,
            behavior: "smooth",
        });
    }

    function scrollBottom() {
        const c = getScrollContainer();
        c.scrollTo({
            top: c.scrollHeight,
            behavior: "smooth",
        });
    }
    // Container für Buttons
    const wrapper = document.createElement("div");
    wrapper.id = "chat-scroll-buttons";
wrapper.style.cssText = `
    position: fixed;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 999999;
`;
    function createButton(symbol, onClick) {
        const btn = document.createElement("button");

        // btn.textContent = symbol;
        btn.innerHTML = symbol;
        btn.style.cssText = `
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: rgba(0, 100, 0, 0.5);
    color: black;
    font-size: 19px;
    font-weight: bold;
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    box-shadow: 0 3px 8px rgba(0,0,0,.35);
    transition: transform .15s, background-color .2s;
`;
        //-----------------------------------------------------------------------------------
        //-----------------------------------------------------------------------------------
        //-----------------------------------------------------------------------------------
        btn.onmouseenter = () => {
            btn.style.transform = "scale(1.08)";
            btn.style.backgroundColor = "rgba(139, 0, 0, 0.5)"; // dunkelrot, 50% transparent
        };

        btn.onmouseleave = () => {
            btn.style.transform = "scale(1)";
            btn.style.backgroundColor = "rgba(0, 100, 0, 0.5)"; // dunkelgrün, 50% transparent
        };
        btn.onclick = onClick;
        return btn;
    }
    //wrapper.appendChild(createButton("⬆", scrollTop));
    //wrapper.appendChild(createButton("⬇", scrollBottom));

    wrapper.appendChild(createButton("▲", scrollTop));
    wrapper.appendChild(createButton("▼", scrollBottom));

    document.body.appendChild(wrapper);
})();