0

ページの実際の実装では、リンクはページとともに移動しますが、ページには表示されません (表示されません)。ブラウザで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;   
            }

クロムでは動作しません。ファイアフォックスでの作業。

4

2 に答える 2

0

これは、あなたの望むことですか

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;
            }

動作デモ

これがお役に立てば幸いです

于 2013-03-26T08:04:44.197 に答える
0

試す:

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

または

$('.scrollup').click(function(){
    $('body').scrollTop($('body')
});
于 2013-03-26T04:08:03.770 に答える