jquery - Jquery滚动顶部元素不移动

Question

在页面的实际实现中，链接与页面一起移动，但在页面中未显示（可见）。当我在浏览器中单击 css 时，元素出现在滚动位置。

---

        //elemet to appear when scrolling
         <a href="#" class="scrollup">Scroll</a>

    $(document).ready(function(){ 

        $(window).scroll(function(){
            if ($(this).scrollTop() > 100) {
                $('.scrollup').fadeIn();
            } else {
                $('.scrollup').fadeOut();
            }
        }); 

        $('.scrollup').click(function(){
            $("html, body").animate({ scrollTop: 0 }, 600);
            return false;
        });

    });

    //css for the element
        .scrollup{
                    width:40px;
                    height:40px;
                    opacity:0.3;
                    position:fixed;
                    bottom:50px;
                    right:100px;
                            display:none;   
            }

不能在铬中工作。在火狐工作。

Answer 1

尝试：

$('.scrollup').click(function(){
    $( 'html, body' ).animate( { scrollTop: $('body').offset().top }, 'slow' );                                     return false;   
});

或者

$('.scrollup').click(function(){
    $('body').scrollTop($('body')
});

Answer 2

这是你想要的吗

js

$(window).scroll(function() {
    if ($(this).scrollTop()) {
        $('.scrollup').fadeIn();
    } else {
        $('.scrollup').fadeOut();
    }
});

$(".scrollup").click(function () {
   //1 second of animation time
   //html works for FFX but not Chrome
   //body works for Chrome but not FFX
   //This strange selector seems to work universally
   $("html, body").animate({scrollTop: 0}, 1000);
});

html

<a href="#" class="scrollup">Scroll</a>

css

.scrollup{
    padding: 5px 3px;
    background: #000;
    color: #fff;
    position: fixed;
    bottom: 0;
    right: 5px;
    display: none;
            }

工作演示

希望这对你有帮助