jQuery マウスホイール プラグインを使用して、ユーザーが上下にスクロールしたかどうかを判断しました。ユーザーが上にスクロールした場合、親要素の最後の子をなしとして表示したいと思います。これは機能しますが、一度だけです。親の他の要素は に移動できませんdisplay:none
。
私が考えた 1 つのオプションは、 を使用することでした.empty()
が、それを使用しても、どの要素も消えません。
実際の例を作成しました。問題を引き起こしていると思われるコードを以下に投稿します。http://jsbin.com/orocat/1/edit
Javascript コードのみ:
$(document).on('mousewheel', function(event, delta) {
if (delta > 0) {
clearTimeout($.data(this, 'timer'));
$.data(this, 'timer', setTimeout(function() {
//here is the code that is causing trouble. I realize that it is
//only selecting the last child but if I used .empty() nothing happens?
$('.body div:last-child').css('display','none');
}, 80));}
else { clearTimeout($.data(this, 'timer'));
$.data(this, 'timer', setTimeout(function() {
//have div elements display themselves again. need to work on this
}, 80));}
});