Как отследить, что пользователь прокрутил скролл вниз или вверх на странице где нет скролл-бара ?
3 ответа
$(document).ready(function() {
$(window).bind('mousewheel DOMMouseScroll MozMousePixelScroll', function(event) {
delta = parseInt(event.originalEvent.wheelDelta || -event.originalEvent.detail);
if (delta >= 0) {
$('#result').html('Вверх');
} else {
$('#result').html('Вниз');
}
});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result"></div>
-
не могу понять, почему ваш код не работает у меня: codepen.io/lexxl/pen/WrwJeJ - слегка изменил для наглядности, т.к. оригинал тоже не работал– lexxlCommented 18 дек. 2015 в 17:45
-
-
видимо, дело таки в нём. не работает в firefox 42.0, проверил в chrome 47 - цвет меняет. как быть?– lexxlCommented 18 дек. 2015 в 18:37
-
обновил ответ. добавлено больше вариантов
bind
, добавлено для FF– xajaCommented 19 дек. 2015 в 12:41
Как то так например
var wheel_handle = null;
var mouse_wheel = function(event) {
if (false == !!event) event = window.event;
var direction = ((event.wheelDelta) ? event.wheelDelta/120 : event.detail/-3) || false;
if (direction && !!wheel_handle && typeof wheel_handle == "function") {
wheel_handle(direction);
}
}
var set_handle = function(id, func) {
document.getElementById(id).onmouseover = function() {
wheel_handle = func;
}
document.getElementById(id).onmouseout = function() {
wheel_handle = null;
}
}
window.onload = function() {
if (window.addEventListener) window.addEventListener("DOMMouseScroll", mouse_wheel, false);
window.onmousewheel = document.onmousewheel = mouse_wheel;
}
-
Дмитрий, можете пожалуйста детально прокомментировать этот код, мне как новичку почти ничего не понятно к сожалению. Commented 29 нояб. 2015 в 8:34
-
Вот статья habrahabr.ru/post/133321 от автора решения ловли прокрутки на любых элементах. Commented 29 нояб. 2015 в 8:41
-
Автор кода идиот, завязывается на настройки по умолчанию и не знает о существвовании мышей со свободным скроллом. 120 и 3 — это не магические константы.– KyubeyCommented 29 нояб. 2015 в 8:56
var scrollTop = $(window).scrollTop();
$(window).scroll(function() {
if($(window).scrollTop() > scrollTop){
console.log("Down");
scrollTop = $(window).scrollTop();
} else{
console.log("Up");
scrollTop = $(window).scrollTop();
}
});
Как вариант