更新:
这里是一个jsbin示例,演示了问题。
基本上,我有以下的javascript代码,它可以将窗口滚动到页面的锚点处:
// get anchors with href's that start with "#"
$("a[href^=#]").live("click", function(){
var target = $($(this).attr("href"));
// if the target exists: scroll to it...
if(target[0]){
// If the page isn't long enough to scroll to the target's position
// we want to scroll as much as we can. This part prevents a sudden
// stop when window.scrollTop reaches its maximum.
var y = Math.min(target.offset().top, $(document).height() - $(window).height());
// also, don't try to scroll to a negative value...
y=Math.max(y,0);
// OK, you can scroll now...
$("html,body").stop().animate({ "scrollTop": y }, 1000);
}
return false;
});
它完美地运作...直到我手动尝试滚动窗口。当滚动条或鼠标滚轮滚动时,我需要停止当前的滚动动画...但我不确定如何做到这一点。
这可能是我的起点...
$(window).scroll(e){
if(IsManuallyScrolled(e)){
$("html,body").stop();
}
}
我不确定如何编写IsManuallyScrolled
函数。我已经在Google Chrome的控制台中查看了e
(即事件对象),据我所知,没有办法区分手动滚动和由jQuery的animate()
滚动调用之间的区别。
如何区分通过jQuery的$.fn.animate
函数调用的滚动和手动滚动?
touchstart
添加到事件列表中,并在事件本身中检查... || e.type == 'touchstart'
。 - Ben