it-roy-ru.com

Как сделать горизонтальную прокрутку на колесе мыши?

Просто сейчас случайно наткнулся на http://www.benekdesign.com/ . Здесь при прокрутке колесика мыши выполняется горизонтальная прокрутка. По правде говоря, мне не понравилась эта функция. Это было немного раздражающим. Но до сих пор, Подскажите пожалуйста как этого добиться. 

Отредактировано

Хорошо, Firebug говорит, что он использует 

/ * Горизонтальная Tiny Scrolling - сценарий плавной прокрутки для горизонтальных веб-сайтов 2 (брат вертикальной «Tiny Scrolling») 3by Marco Rosella - http://www.centralscrutinizer.it/en/design/js-php/horizontal-tiny-scrolling 4 v0.6 - 14 февраля 2007 г. 

19
Rakesh Juyal

Похоже, он просто отображает событие mousewheel на прокрутку области. В IE это действительно легко, просто используя метод doScroll() - он будет прокручивать горизонтальную полосу на величину, на которую обычно прокручивает вертикальная полоса. Другие браузеры не поддерживают метод doScroll(), поэтому вам придется жить с прокруткой на произвольную величину:

var mouseWheelEvt = function (event) {
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    else if ((event.wheelDelta || event.detail) > 0)
        document.body.scrollLeft -= 10;
    else
        document.body.scrollLeft += 10;

    return false;
}
document.body.addEventListener("mousewheel", mouseWheelEvt);
24
Andy E

Поскольку приведенные выше решения не работают для меня, вот еще один, который я только что нашел: http://css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel/

Пример: http://digwp.com/archives/horz/

8
madc

Другая форма:

document.addEventListener('wheel', (e) => {
    document.getElementById('scroll_container').scrollLeft += e.deltaY;
})
0
Heddie Franco