当用户使用滚轮滚动时,我一直试图让div上下滑动。出于某种原因,要么保持放置的一个div完全消失,要么滚动事件仅适用于第三个div。我真的很困惑,因为我尝试调试的次数越多,我越是偶然发现另一个故障,我不确定它是不是我的代码还是魔法鼠标滚动&#34 ;轮"这导致了问题。
我有类<div class="slider">...
列出的div我有一个循环遍历类滑块的div并返回第一个可见的div的方法,或者返回第三个:
function getCurrentSlider(){
$(".slider").each(function() {
if ($(this).is(":visible")) {
return $(".slider");
}
});
return $("#slideThree");
}
然后由slideItUp()
函数调用它,它告诉getCurrentSlider()
的div向上滑动到窗口的顶部。
function slideItUp(){ //for when I slide the scroll wheel DOWN the div goes UP
currentSlider = getCurrentSlider();
currentSlider.slideUp(800);
}
slideItDown()
基本上做同样的事情,但它试图向上移动对象链,因为getCurrentSlider()
所指向的最后一个将是第三个,如果没有别的是可见。这是代码:
function slideItDown(){ //for when I slide the scroll wheel UP the div goes DOWN
currentSlider = getCurrentSlider();
if (currentSlider.is(":visible")) { //if the slider is currently visible...
currentSlider = $(this).prev(".slider"); //get the slider before it and...
currentSlider.slideDown(800); //slide that one down.
} else { //if the current slider is invisible...
currentSlider.slideDown(800);//slide it down
}
}
以下是我用来聆听鼠标滚轮移动的方法:
$(window).bind('mousewheel', function(e){ //correctly grabs scroll events
if(e.originalEvent.wheelDelta > 0)
{
slideItDown();
}
else
{
slideItUp();
}
});
这是我的代码的小提琴:http://jsfiddle.net/jdktN/
我是JavaScript和JQuery的初学者。谢谢你的帮助。