Skip to content Skip to sidebar Skip to footer

Issue With Horizontal Wheel Scroll

I have a template that when user use mouse wheel the template scroll horizontally . but it just work in chrome . is there any way to scroll horizontally in firefox and IE ? here i

Solution 1:

It needs to work off the html element, not body element for Firefox.

$("body, html").mousewheel....

Solution 2:

I've used this function, it's a bit hacky, but does the job.

functionscrollPage (e) {
    var delta = e.deltaX || e.wheelDelta,
        dir = (delta > 0) ? -90 : 90;
    if (window.addEventListener && !(window.chrome || window.opera)) {
        dir *= -1;
    }
    window.scrollBy(dir, 0);
    e.returnValue = false;
    if (e.preventDefault) {
        e.preventDefault();
    }
    returnfalse;
}

And attach the event:

if (window.addEventListener && (!window.chrome && !window.opera)) {
    window.addEventListener('wheel', scrollPage, false); // IE9+, FF
} elseif (window.chrome || window.opera) {
    window.addEventListener('mousewheel', scrollPage, false); // Chrome & Opera
} else {
    document.attachEvent('onmousewheel', scrollPage); // IE8-
}

A live demo at jsFiddle.

Post a Comment for "Issue With Horizontal Wheel Scroll"