当你将鼠标悬停在div上时,我试图让我的页面滚动.这是我到目前为止所得到的
$(document).ready(function() {
$("#hoverscroll").mouSEOver(function() {
var div = $('body');
setInterval(function(){
var pos = div.scrollTop();
div.scrollTop(pos + 1);
},100)
});
});
但是,还有两件事要做.我需要它在每次单击时提高速度,在不再悬停时停止并将速度重置为默认值.
我正在努力实现这样的目标：
$(document).ready(function() {
$("#hoverscroll").mouSEOver(function() {
var div = $('body');
setInterval(function(){
var count = 1;
var pos = div.scrollTop();
div.scrollTop(pos + count);
},100)
});
$("#hoverscroll").click(function() {
if (count < 6) {
count = count+1;
}
});
$("#hoverscroll").mouseleave(function() {
count = 0;
});
});
我搜索并发现有些人在谈论绑定事件并设置一个全局变量来检查它是否在滚动.但上述功能会起作用吗？我仍在学习.我可能完全错了.
解决方法
你很近 – 这是我的版本(
http://jsfiddle.net/Lcsb6/)
$(document).ready(function() {
var count;
var interval;
$("#hoverscroll").on('mouSEOver',function() {
var div = $('body');
interval = setInterval(function(){
count = count || 1;
var pos = div.scrollTop();
div.scrollTop(pos + count);
},100);
}).click(function() {
count < 6 && count++;
}).on('mouSEOut',function() {
// Uncomment this line if you want to reset the speed on out
// count = 0;
clearInterval(interval);
});
});
变更注意事项：
> count定义在interval / bindings之上.从某种意义上来说,它不是“全局”的,你可以在窗口中看到它,但它被降级为生活在onReady闭包内.> interval是setInterval的赋值 – 这样我们可以阻止它以后用clearInterval做任何事情>我以前没见过mouseleave,但是mouSEOut应该这样做.>在jQuery中,你可以把东西连在一起 – 所以$(‘#hoverscroll’).on(…).click(…).on(…).addClass(…).blah(. ..)将节省您每次输入选择器的时间.另外,如果您打算使用链接,请查看jQuery的end()方法.>我更喜欢使用$.fn.on而不是像.click()那样的缩写 – 它清楚地表示你正在使用一个事件处理程序,考虑为你打开额外的几个字符并删除$()中多余的字符选择？
