0

これは私がすでに持っているコードです：

$(document).ready(function()
{
    /*Scrolls to whichever element is clicked if is has .scrollPage class */
    $('.scrollPage').click(function() {
        var elementClicked = $(this).attr("href");
        var destination = $(elementClicked).offset().top;
        $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination-0}, 500 );
        return false;
    });

    $('#backToTop').hide();
    $('#sideNav').hide();

    var headerHeight = $('#header').height();   

    /* Detect when page is scrolled */
    $(document).scroll(function(){ 
        var scrolledpx = parseInt($(document).scrollTop()); 
        if (scrolledpx > headerHeight) {
            $("#backToTop").fadeIn(500);
            $("#sideNav").fadeIn(500);
        }
        else if (scrolledpx < headerHeight) {
            $("#backToTop").fadeOut(500);
            $("#sideNav").fadeOut(500);         
        }
    });


});

#backToTopに対応するHTMLは次のとおりです。

<div id="backToTop">
Top
</div>

そしてCSS：

.backToTop {
position: fixed;
top: 10px;
left: 10px;
}

問題は、ヘッダーの下をスクロールすると#backToTopが表示されないことですが、リンクをクリックして特定のセクションにスクロールすると（正常に機能します）、＃backToTop用のスペースが残っているようです（つまり、シフトするだけです）。ページを1行下に移動します）が、表示されません。私は何が間違っているのですか？

4

2 に答える 2

0

すみません、非常に単純です。#backToTop ではなく、CSS で .backToTop を使用していました。

于 2013-03-13T16:28:52.270 に答える
0

このフィドルを参照してください: http://jsfiddle.net/Fcden/

CSS は次のようになります。

#backToTop {
position: fixed;
top: 10px;
left: 10px;
}

backToTop(ではidないclass) が div に割り当てられているため、

于 2013-03-13T16:29:18.823 に答える