JavaScript - GoToTop 作法


Posted by hoyi-23 on 2021-06-16

<html>
<a href="#" class="gotop">
    <!--gotopicon-->
</a>
</html>

點擊向上滾動按鈕,執行向上滾動。

<script>
function goTop(e) {
    e.preventDefault();
    if (e.target.offsetParent.classList.value == 'gotop') {
        document.body.scrollTop = 0; // For Safari
        document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
    }
}
body.addEventListener('click', goTop);
</script>

scroll to top

$(document).ready(function () {
    $(window).scroll(function (e) {
        var scrollY = window.scrollY;
        if (scrollY < 500) {
            $('.top-btn').addClass('show');
        } else{
            $('.top-btn').removeClass('show');
        }

    $('.top-btn').click(function(){
        $('html,body').animate({
          scrollTop: 0
        },1000);
    });

});

#GoToTop







Related Posts

hexo 部署在 AWS S3 上面

hexo 部署在 AWS S3 上面

MTR04_0923

MTR04_0923

D11_JS101 綜合題目練習 Lv1

D11_JS101 綜合題目練習 Lv1


Comments