Horizontal jquery scroll with mouse wheel

Question

I currently have a site that is scrolling ( http://www.studioimbrue.com ) and I'm trying to link the mouse wheel to scroll sideways. I am currently using the one found on thehorizontalway.com (called thw.js), but it does not work in all browsers (Chrome).

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

Answer 1

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

To develop a little, the mousewheel function gives an event object and a delta.

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

The delta value depends on how fast you spin the wheel. I saw a range of +50 to -50 if you are trying very hard: P

Answer 2

I used the $ (window) .bind method in the comments, but it will not scroll backward, only forward, 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> 

Answer 3

This solution from the above comments works, but only when the mouse is 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 you just throw in empty space (for example, if your content is very short and bottom to bottom), it will work for about one scroll, and then it will break (until you scroll back), why you might think that scrolling works only in one direction . It also looks like all the scrolling plugins that people recommend for this. Hope this helps people find a solution in the future.