как заставить работать селектор jQuery в окне браузера

Question

Привет, я использую расширение jQuery mousewheel

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

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

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

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

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

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

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

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

Answer 1

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

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

Answer 2

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

CSS

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

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

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

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

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