gototop

/* SCROLL BUTTONS - GoToTop + GoToBottom */
.scroll-btn {
    position: fixed !important;
    right: 30px !important;
    width: 50px !important;
    height: 50px !important;
    cursor: pointer !important;
    z-index: 9999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.4s ease, visibility 0.4s ease !important;
    pointer-events: none !important;
}
.scroll-btn.visible {
    opacity: 0.8 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
.scroll-btn:hover {
    opacity: 1 !important;
}
.scroll-to-top {
    bottom: 30px !important;
}
.scroll-to-bottom {
    top: 30px !important;
    transform: rotate(180deg) !important;
}
@media (max-width: 768px) {
    .scroll-btn {
        width: 45px !important;
        height: 45px !important;
    }
    .scroll-to-top {
        bottom: 20px !important;
        right: 20px !important;
    }
    .scroll-to-bottom {
        top: 20px !important;
        right: 20px !important;
    }
}

(function () {
    if (window._scrollBtnsInit) {
        if (window.console) console.log('[ScrollBtns] SKIP: Bereits initialisiert (Singleton)');
        return;
    }
    window._scrollBtnsInit = true;

    var PREFIX = '[ScrollBtns] ';
    var THRESHOLD = 1000;
    var timer = null;
    var isVisible = false;

    function log(msg) {
        if (window.console && console.log) {
            console.log(PREFIX + msg);
        }
    }

    var topBtn = document.getElementById('scrollTopBtn');
    var bottomBtn = document.getElementById('scrollBottomBtn');

    if (!topBtn || !bottomBtn) {
        log('Buttons nicht gefunden!');
        return;
    }

    log('Init gestartet...');

    document.body.appendChild(topBtn);
    document.body.appendChild(bottomBtn);
    log('Buttons an body verschoben (Stacking Fix)');

    function goToTop(e) {
        if (e && e.preventDefault) e.preventDefault();
        document.body.scrollTop = 0;
        document.documentElement.scrollTop = 0;
        log('Scroll to Top');
    }

    function goToBottom(e) {
        if (e && e.preventDefault) e.preventDefault();
        var maxScroll = Math.max(
            document.body.scrollHeight || 0,
            document.documentElement.scrollHeight || 0
        );
        document.body.scrollTop = maxScroll;
        document.documentElement.scrollTop = maxScroll;
        log('Scroll to Bottom: ' + maxScroll + 'px');
    }

    function updateVisibility() {
        var scrollTop = window.pageYOffset ||
                        document.documentElement.scrollTop ||
                        document.body.scrollTop || 0;

        if (scrollTop > THRESHOLD && !isVisible) {
            topBtn.className = 'scroll-btn scroll-to-top visible';
            bottomBtn.className = 'scroll-btn scroll-to-bottom visible';
            isVisible = true;
            log('Buttons sichtbar (Scroll > ' + THRESHOLD + 'px)');
        } else if (scrollTop <= THRESHOLD && isVisible) {
            topBtn.className = 'scroll-btn scroll-to-top';
            bottomBtn.className = 'scroll-btn scroll-to-bottom';
            isVisible = false;
        }
    }

    if (topBtn.addEventListener) {
        topBtn.addEventListener('click', goToTop, false);
        bottomBtn.addEventListener('click', goToBottom, false);
    } else if (topBtn.attachEvent) {
        topBtn.attachEvent('onclick', goToTop);
        bottomBtn.attachEvent('onclick', goToBottom);
    }

    if (window.addEventListener) {
        window.addEventListener('scroll', function () {
            clearTimeout(timer);
            timer = setTimeout(updateVisibility, 80);
        }, false);
    } else if (window.attachEvent) {
        window.attachEvent('onscroll', function () {
            clearTimeout(timer);
            timer = setTimeout(updateVisibility, 80);
        });
    }

    updateVisibility();
    log('Fertig! Threshold: ' + THRESHOLD + 'px');
})();