我在找这样的东西:
$(window).scroll(function(event){
if (/* magic code*/ ){
// upscroll code
} else {
// downscroll code
}
});
什么好主意吗?
我在找这样的东西:
$(window).scroll(function(event){
if (/* magic code*/ ){
// upscroll code
} else {
// downscroll code
}
});
什么好主意吗?
当前回答
在元素的.data()中,您可以存储JSON和测试值来启动事件
{ top : 1,
first_top_event: function(){ ...},
second_top_event: function(){ ...},
third_top_event: function(){ ...},
scroll_down_event1: function(){ ...},
scroll_down_event2: function(){ ...}
}
其他回答
你应该试试这个
var scrl
$(window).scroll(function(){
if($(window).scrollTop() < scrl){
//some code while previous scroll
}else{
if($(window).scrollTop() > 200){
//scroll while downward
}else{//scroll while downward after some specific height
}
}
scrl = $(window).scrollTop();
});
为了忽略页面顶部和底部的任何snap / momentum / bounce back,这里是Josiah接受的答案的修改版本:
var prevScrollTop = 0;
$(window).scroll(function(event){
var scrollTop = $(this).scrollTop();
if ( scrollTop < 0 ) {
scrollTop = 0;
}
if ( scrollTop > $('body').height() - $(window).height() ) {
scrollTop = $('body').height() - $(window).height();
}
if (scrollTop >= prevScrollTop && scrollTop) {
// scrolling down
} else {
// scrolling up
}
prevScrollTop = scrollTop;
});
使用这个来找到滚动方向。这只是为了找到垂直滚动的方向。支持所有跨浏览器。
var scrollableElement = document.getElementById('scrollableElement');
scrollableElement.addEventListener('wheel', findScrollDirectionOtherBrowsers);
function findScrollDirectionOtherBrowsers(event){
var delta;
if (event.wheelDelta){
delta = event.wheelDelta;
}else{
delta = -1 * event.deltaY;
}
if (delta < 0){
console.log("DOWN");
}else if (delta > 0){
console.log("UP");
}
}
例子
检查当前的scrollTop和之前的scrollTop
var lastScrollTop = 0;
$(window).scroll(function(event){
var st = $(this).scrollTop();
if (st > lastScrollTop){
// downscroll code
} else {
// upscroll code
}
lastScrollTop = st;
});
存储之前的滚动位置,然后查看新的滚动位置是否大于或小于该位置。
这里有一个避免任何全局变量的方法(在这里可以找到):
(function () {
var previousScroll = 0;
$(window).scroll(function(){
var currentScroll = $(this).scrollTop();
if (currentScroll > previousScroll){
alert('down');
} else {
alert('up');
}
previousScroll = currentScroll;
});
}()); //run this anonymous function immediately