1

ユーザーがページを 600px 下にスクロールした後にフェードインしたい div があります。以下のコードを使用して、これを簡単に達成しました。

<script>
$(window).scroll(function(){
if($(window).scrollTop()>600){
$("#fade-in-area").fadeIn();
}else{
$("#fade-in-area").fadeOut();
}
});
</script>

同じ div をページの下部から約 600 ピクセルでフェードアウトさせたい。他の人がこれをやろうとしているのを見たことがありますが、フェードインとフェードアウトの両方を行う方法がわかりません。

私が思うに、通常の Javascript プログラマーにとってはかなり簡単なはずです。

誰でも私を助けることができますか？

4

1 に答える 1

3

このコードを試してください：

<script>
   $(window).scroll(function(){
       var leftToBottom = $(document).height() - $(window).height() - $(window).scrollTop();
       var distanceFromTop = $(window).scrollTop();
       if( distanceFromTop > 600 && !$("#fade-in-area").is(":visible") 
          && leftToBottom > 600) {
            $("#fade-in-area").fadeIn();
       }else if($("#fade-in-area").is(":visible") && (distanceFromTop < 600 || leftToBottom < 600)){
            $("#fade-in-area").fadeOut();
      }
   });
</script>

下にスクロールする残りが 600 ピクセル未満の場合は、div をフェードアウトする必要があります。

于 2012-09-24T22:09:22.670 に答える