「スクロールダウン」イベントをキャプチャしますか？

Question

私は非常に単純なWebページ（HTMLのみ）を設計しています。実装したい唯一の「機能」は、ユーザーがページをスクロールするときに何かをすることです。何らかの形でその「イベント」をキャプチャする方法はありますか？

Answer 1

は、別のJSのフレームワーク（MooToolsは）

window.addEvent('scroll',function(e) { 
    //do stuff 
}); 

Answer 2

HTMLだけではできません.Javascriptを使用する必要があります。あなたがしたいかjQuery使用することはできませんしていない場合、あなたはアンソニーによって投稿onscrollソリューションを使用することができます

$(document).ready(function() { 
    $(window).scroll(function() { 
     // do whatever you need here. 
    }); 
}); 

：あなたのソリューションは次のように見ることができるので、私は、jQueryを使用することをお勧めします。あなたは（あなたが非常に簡単なHTMLページのために何しない場合があります）のjQueryを使用したくない場合は、あなたが定期的にJavascriptを使用してこれを実現することができます

Answer 3

：

<script> 
function scrollFunction() { 
    // do your stuff here; 
} 

window.onscroll = scrollFunction; 
</script> 

あなたが何かをしたいと述べましたスクロールしたときにが表示されます。ページ - onscrollイベントは、x軸またはy軸のいずれかの方向にスクロールして消えるため、スクロールするたびに関数が呼び出されます。

ページをスクロールしたときにコードを実行するだけの場合は、以前のスクロール位置を維持して、onscrollが呼び出されるたびに比較する必要があります。ただ、完全性について

Answer 4

より良い方法は、スクロールイベントのためだけでなく、以下のようにスクロール方向をチェックするだけではありませんを使用して別の解決策があります。

$(window).bind('mousewheel', function(event) { 
if (event.originalEvent.wheelDelta >= 0) { 
    console.log('Scroll up'); 
} 
else { 
    console.log('Scroll down'); 
} 
}); 

Answer 5

これは私に役立ちます。

var previousPosition 

$(window).scroll(function(){ 
    var currentScrollPosition=$(window).scrollTop() + $(window).height() 
    if (currentScrollPosition>previousScrollPosition) { 
    console.log('down') 
    }else if(currentScrollPosition<previousScrollPosition){ 
    console.log('up') 
    } 
    previousScrollPosition=currentScrollPosition 
});