I want to develop a webpage that moves towards the left direction whenever the user scrolls down the mousewheel. Generally all websites are vertical scrolling. But this one should scroll horizontally.
Example code:
<body>
<div style="width:10000px; height:400px; top:0; left:0;">
//here goes the content.
</div>
</body>
My objective is to scroll the DIV horizontally on mouse-wheel scroll, using jQuery or any other Javascript tool.
You can move the contents of windows that have horizontal scroll bars to the left or right using the keyboard and the mouse. Move contents to the right: Press the Shift key and scroll the mouse wheel up. Move contents to the left: Press the Shift key and scroll the mouse wheel down.
For horizontal scrollable bar use the x and y-axis. Set the overflow-y: hidden; and overflow-x: auto; that will automatically hide the vertical scroll bar and present only the horizontal scrollbar. The white-space: nowrap; property is used to wrap text in a single line.
The HTML <marquee> tag defines a scrolling text area in the HTML document that moves across the page in a horizontal or vertical direction. By default, text found within the <marquee> tag will scroll from right to left.
Horizontal page scrolling using Javascript
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With