Как я могу дифференцировать ручную прокрутку (через mousewheel/scrollbar) от прокрутки Javascript/jQuery?
ОБНОВЛЕНИЕ:
Вот jsbin пример, демонстрирующий проблему.
ОБНОВЛЕНИЕ 2:
И вот исправленная версия благодаря fudgey.
В основном у меня есть следующий 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;
});
Это работает отлично......, пока я вручную не пытаюсь прокрутить окно. Когда полоса прокрутки или mousewheel прокручиваются, я должен остановить текущую анимацию прокрутки..., но я не уверен, как сделать это.
Это - вероятно, моя начальная точка...
$(window).scroll(e){
if(IsManuallyScrolled(e)){
$("html,body").stop();
}
}
... но я не уверен, как кодировать IsManuallyScrolled функция. Я проверил e ( event объект) в консоли и AFAIK Google Chrome там не способ дифференцироваться между ручной прокруткой и jQuery animate() прокрутить.
Как я могу дифференцироваться между ручной прокруткой и одним названным с помощью jQuery $.fn.animate функция?
2 ответа
Попробуйте эту функцию:
$('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(e){
if ( e.which > 0 || e.type == "mousedown" || e.type == "mousewheel"){
$("html,body").stop();
}
})
Кроме того, вы видели это руководство ?
Обновление: современные браузеры теперь используют «колесо» в качестве события, поэтому я включил его в приведенный выше код.
Вы могли бы установить переменную для указания того, что ваш вызов animate был активен, а затем проверить эту переменную в обработчике прокрутки.
window.IsAutoScrolling = true;
$("html,body").stop().animate({ "scrollTop": y }, 1000);
// Do something to set IsAutoScrolling = false, when the animation is done.
$(window).scroll(e){
if(!window.IsAutoScrolling){
$("html,body").stop();
}