Подтвердить что ты не робот

Javascript привязывает обработчик событий к горизонтальной прокрутке

Есть ли способ в javascript привязать обработчик события к горизонтальной прокрутке, в отличие от общего события прокрутки, которое запускается, когда пользователь прокручивает по горизонтали и по вертикали? Я хочу вызвать событие только тогда, когда пользователь прокручивается по горизонтали.

Я искал для ответа на этот вопрос, но ничего не мог найти.

Спасибо!

P.S. Приносим извинения, если неправильно использую какую-либо терминологию. Я новичок в javascript.

UPDATE

Большое спасибо за все ваши ответы! В общем, похоже, вы все говорите, что это не поддерживается в javascript, но я могу выполнить функциональность с чем-то вроде этого (используя jQuery) (jsFiddle):

var oldScrollTop = $(window).scrollTop();

$(window).bind('scroll', function () {
    if (oldScrollTop == $(window).scrollTop())
        //scrolled horizontally
    else {
        //scrolled vertically
        oldScrollTop = $(window).scrollTop();
    }
});​

Это все, что мне нужно было знать. Еще раз спасибо!

4b9b3361

Ответ 1

Ответ на мой телефон, поэтому не могу предоставить код на данный момент.

Что вам нужно сделать, так это подписаться на событие прокрутки. Для вертикального/горизонтального не существует конкретного.

Затем вам нужно будет получить некоторые измерения относительно текущей области отображения. Вам нужно будет измерить window.clientHeight и window.clientWidth.

Далее, получите window.top и window.left. Это скажет вам, где находится позиция просмотра, т.е. Если она больше 0, то используются полосы прокрутки.

Это довольно простая математика отсюда, чтобы получить то, что вам нужно. Если ни один другой не предоставил пример кода в ближайшие несколько часов, я постараюсь сделать это.

Изменить: Немного дополнительная информация.

Вы должны зафиксировать событие прокрутки. Вам также нужно сохранить исходные свойства window.top и window.left. Всякий раз, когда происходит событие прокрутки, выполните простую проверку, чтобы увидеть, отличаются ли текущие значения верхнего/левого значения от значения магазинов.

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

Проведите некоторые поиски диспетчеризации событий в js.

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

Ответ 2

Я написал для вас плагин jQuery, который позволяет прикреплять функции к событию scrollh.

Посмотрите на действие в jsfiddle.net.

/* Enable "scrollh" event jQuery plugin */
(function ($) {
    $.fn.enableHScroll = function() {
        function handler(el) {
           var lastPos = el
              .on('scroll', function() {
                 var newPos = $(this).scrollLeft();
                 if (newPos !== lastPos) {
                     $(this).trigger('scrollh', newPos - lastPos);
                     lastPos = newPos;
                 }
              })
              .scrollLeft();
        }
        return this.each(function() {
            var el = $(this);
            if (!el.data('hScrollEnabled')) {
                el.data('hScrollEnabled', true);                 
                handler(el);
            }
        });
    }
}(jQuery));

Это прост в использовании:

$('#container')
    .enableHScroll()
    .on('scrollh', function(obj, offset) {
        $('#info').val(offset);
    });

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

Ответ 3

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

Ответ 4

Вы можете проверить, изменилось ли значение x страницы и проигнорировало значение y.

Если изменяется значение x: имеется горизонтальная прокрутка.

Ответ 5

При загрузке страницы сохраните начальные позиции полосы прокрутки для двух переменных (предположительно оба будут равны 0). Затем, всякий раз, когда происходит событие прокрутки, найдите свойства scrollleft и scrolltop. Если значение свойства scrollleft отличается, а значение scrolltop такое же, как и их более ранние значения, это горизонтальная прокрутка. Затем установите значения переменных для новых значений прокрутки.

Ответ 6

Нет, специального события для горизонтальной прокрутки не существует (оно предназначено для глобальной прокрутки), но вы можете попытаться проверить положение контента по свойству .scrollLeft и если оно отличается от предыдущего значения, это означает, что пользователь прокручивал контент по горизонтали.