jquery horizontal scroll with mousewheel

2019-01-18 15:55发布

I currently have a site that is a sidescroller (http://www.studioimbrue.com) and I'm trying to bind a mousewheel to scroll sideways. Currently I'm using the one found at thehorizontalway.com (called thw.js) but it doesn't seem to work in all browsers (Chrome).

I'm trying to get this one to work: http://brandonaaron.net/code/mousewheel/docs , to simply scroll the whole window, nothing else. There is very limited documentation so I can't figure it out. Any help is appreciated.

3条回答
Rolldiameter
2楼-- · 2019-01-18 16:06

This solution from the comments above works, but only when moused over the actual element on the page.

$(window).bind('mousewheel', function(event, delta) {
    if (delta > 0) { window.scrollBy(-80,0); 
    } else window.scrollBy(80,0) ; 
});

When just mousing over empty space (for example, if your content is very short and there's some window left over at the bottom) it'll work for about one scroll, and then break (until you scroll back left), which is why one might think that scrolling only works one way. This also seems to be the case with all of the fancy scroll plugins people recommend for this. Hopefully this helps people find a solution in the future.

查看更多
Anthone
3楼-- · 2019-01-18 16:17

I used the $(window).bind approach in the comments but it wont scroll backwards, only forwards, for both up and down on the wheel.

<script>
    $(window).bind('mousewheel', function(event, delta) {
        if (delta > 0) { window.scrollBy(-80,0); 
        } else window.scrollBy(80,0) ; 
    });
</script>
查看更多
Fickle 薄情
4楼-- · 2019-01-18 16:20

I just answered this question about scrolling a div horizontally, I also included some code to use the mousewheel or just grab and drag with the mouse... maybe some of that code will give you an idea?

To elaborate a bit, the mousewheel function gives you the event object and the delta.

$('#container').bind('mousewheel', function(event,delta){
 if (delta > 0) {
   // mousewheel is going up; 
 } else {
   // mousewheel is going down 
 }
});

The value of delta depends on how fast you scroll the wheel. I've seen a range from +50 to -50 if you try really hard :P

查看更多
登录 后发表回答