1

ページの上部からの距離に基づいて、単純な「スクロールして上部に戻る」画像を表示および非表示にしようとしています。例として、上から 100 ピクセル離れているとします。

これが私が持っているものです。下にスクロールするとうまくいくようで、画像のdivがフェードインします。

スクロールして一番上に戻ると、div は表示されませんfadeOut。任意のヒント？

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

1 に答える 1

12

コードにタイプミスがあると思います$('.#toTop').fadeOut();:$('#toTop').fadeOut();

アップデート

単純な改善です。スクロールするたびに要素がフェードしないようにするには、以前にすでにフェードされていないかどうかを確認します。

var $toTop = $('#toTop');
$(window).scroll(function () {
    if ($(this).scrollTop() > 100) {
        $toTop.fadeIn();
    } else if ($toTop.is(':visible')) {
        $toTop.fadeOut();
    }
});
于 2013-08-06T19:07:58.383 に答える