In today’s post we bring to you 10 jQuery Horizontal Scroll Demos & Plugins useful for those who see things horizontally. I guess we have to accept some people scroll both ways! :)

1. Smooth Vertical or Horizontal Page Scrolling with jQuery

In this tutorial we will create a simple smooth scrolling effect with jQuery. We will create a horizontal and a vertical website layout to show the effect.


2. Horizontal Scrolling with jQuery [Updated]

To get horizontal scrolling the Mouse Wheel Plugin by Brandon Aaron (GitHub, Download) will be used to detect mouse wheel movements like a keypress and of course, jQuery itself will be used.


3. Mouse Wheel Event in HTML5 Pages

Supporting the mouse wheel can add further interactivity to your HTML5 web pages. Rather than scrolling the page, you could perform a different action such as zooming in or out.


4. Horizontal content scroll with jQuery

In this tutorial we will create a simple smooth horizontal content scrolling effect with just a few lines of jQuery without using any plugin. We will use HTML and CSS for the layout and jQuery for the scrolling.


5. jQuery Horizontal automatic Scrollbars with mouse

We all know that horizontal scrollbars are hideous. So, wouldn’t it be nice if we had a simple way to represent horizontal overflow? The jQuery horizontal scrollbar is very easy to implement. Feel free to check out the demo and download the source code.


6. jQuery mousewheel easing horizontal scrolling

Learn how to create jQuery mousewheel easing horizontal scrolling in this tutorial.


7. simplyScroll v2

A scroll-tastic jQuery plugin that can animate (scroll) content either automatically or manually, horizontally or vertically, backwards or forwards.

Source + Demo

8. Portfoliojs

It is a lightweight jQuery gallery plugin for your beautiful images with horizontal scrolling which supports desktop, tablet and mobile browsers.

Source + Demo

9. Sly

It is a jQuery plugin for one-directional scrolling simulation with item based navigation support and lots of other goodies.

Source + Demo

10. Smooth Div Scroll jQuery Plugin

is a jQuery plugin that scrolls content horizontally left or right. Smooth Div Scroll does not limit the scrolling to distinct steps.


Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

  • David

    Thank you for this! I’ve been looking all over the place for a post like this one. Excellent selection here, will definitely use them in future projects.

  • Rizaldi

    It’s great, Thank you for sharing!

  • Vivek Moyal

    Thank You …….. you helped me

    • jQuery4u


  • Larry Wall


    • jQuery4u

      Thanks! Nice tat!

  • Pingback: jQuery learning — top to button and float window | My Blog()

  • Sony


  • rama krishna

    very nice and helpful

  • Pingback: » Blog Archive » 10 jQuery Horizonal Scroll Demos & Plugins | jQuery4u()

  • Sumiran Kumar

    Hey all..
    Anybody can tell me .

    I am using a slider, & all slider load/merge on refresh page,
    So how to set only one slider img on loading time.

  • Jules

    I need to add an image (picture) scrolling mechanism to my daughter’s web page. She wants to display her tee shirt designs, one at a time for a few seconds (setable value) and also have the ability to manually change to the previous or next picture manually by clicking on the left or right arrow. I have been searching online for many hours, trying things. I would appreciate a basic example from which I could figure out how to do this. I have written HTML and Javascript in the past, but am extremely rust. I write C code at my job, so I have written lots of code.
    I would love to write and test it on my PC, pulling the images from the hard drive to test it before I add it to her web page. Thank you.

Learn JavaScript for free!
Free course: Introduction to JavaScript

Yours when you take up a free 14-day SitePoint Premium trial.