Horizontal iScroll issues on desktop browsers

问题

I'm trying to implement horizontal scrolling for a desktop website using iScroll.js. Dragging is working fine, and styling is applied ok, but I'm finding issues with scrolling.

Initially I used iScroll 4.1.7 Mousewheel not working as it should on PC's On Macs Chrome and Safari have issues with preventing native scrolling, specifically, if you the user has activated the trackpad preference: Swipe between pages, if you scroll to the left (back), it opens previous page. Firefox is scrolling OK Dragging is working fine.

Subsequently tried v4.2.5: https://github.com/cubiq/iscroll This doesn't seem to scroll or mousewheel at all on desktop browsers. Dragging works fine.

This is how I'm trying to initialize iScroll: (as defined in the documentation here: http://cubiq.org/iscroll-4 )

<script type="application/javascript" src="iscroll.js"></script>
<script type="text/javascript">
var myScroll;
function loaded() {
myScroll = new iScroll('wrapper');
}
document.addEventListener('DOMContentLoaded', loaded, false);
</script>`

Below is a demo of:

iScroll 4.1.7 http://anything.is/iscroll4-1-7

iScroll 4.2.5 http://anything.is/iscroll4-2-5

Any ideas if I am doing something wrong, or if these are real issues?

回答1:

I don't really know if the mousewheel option is supposed to be set by default, but you could try and add it like this:

function loaded() {
    myScroll = new iScroll('wrapper', {
        wheelHorizontal: true
    });
}

This is tested with iscroll 4.2.2 on Chrome, meaning it might not be the perfect solution but sure looks like a quick fix. 4.2.5 should do it!

Found the answer here: iScroll 4 horizontal mousewheel scroll There's a jsFiddle in the page you can check it out! Hope this helped.

来源：https://stackoverflow.com/questions/15352639/horizontal-iscroll-issues-on-desktop-browsers