как сделать работу селектора JQuery во всем окне браузера

Question

Привет я использую jQuery mousewheel extension

и использует следующую привязку

$('html').bind('mousewheel', function(event, delta) { 
    window.scrollBy(-120 * delta, 0); 
    return false; 
}); 

дельта определяется движением колеса мыши и страницы свитки горизонтально.

Все в порядке, если вы перемещаете курсор на пустое место, где нет текста или изображения, обычно нет элемента html, тогда движение колесика мыши не реагирует. Я уверен, что это связано с тем, как работает связка.

Я сделал невидимый 100% на 100% фиксированный pos div, чтобы проверить мою теорию, и прокрутка будет работать отлично. Хотя это кажется мне взломанным, и я задавался вопросом о правильных реализациях этого кода.

Как я могу вызвать эту функцию на странице браузера?

Большое вам спасибо!

Обновление: Дэвид взял на себя инициативу, чтобы сделать тестовую страницу с его кодом here. Может ли кто-нибудь сказать мне, работает ли он для вас, как для него? Это не работает для меня, то есть я могу только прокручивать страницу по горизонтали, только если мой указатель находится над красным прямоугольником.

Answer 1

Вы попробовали привязать его к document или window?

$(document).bind('mousewheel', function(event, delta) { 
    window.scrollBy(-120 * delta, 0); 
    return false; 
}); 

Answer 2

Я столкнулся с точно такой же проблемой и смог ее решить, см. this eg.

CSS

html,body 
{ 
    width:100%; 
    height:100%; 
    overflow:hidden; 
    margin:0; 
    padding:0; 
} 

#wrapper 
{ 
    width:100%; 
    height:100%; 
    overflow:auto; 
} 

Пожалуйста, обратите внимание, что вам нужно применить событие колеса мыши к элементу #wrapper.

Это позволяет оберточному элементу удерживать пространство, которое может остаться незанятым, прежде чем полагаться на html или body.

Вы можете заметить, что ширина определяется таблицей, которую я нашел, является наилучшим подходом на горизонтальных веб-страницах.