Sometimes we want to improve the default appearance of scroll bars. Here we present couple “jQuery nice scrollbars” plugins, that really supports this task.
Using jQuery nice scrollbars plugins
SimpleBar is a plugin that tries to solve a problem of ugly, default scroll bars. With this plugin, custom scrollbars made simple, lightweight, easy to use and cross-browser.
Include jQuery and SimpleBar:
<link rel="stylesheet" href="css/simplebar.css" />
Now we can use the plugin via data attributes, by setting:
https://github.com/Grsmto/simplebar 2. NanoScroller
The nanoScroller.js is a jQuery plugin, that offers a simplistic way of implementing Mac OS X Lion-styled scrollbars for our web projects. It uses minimal HTML markup.
The latest version utilizes native scrolling and works with the iPad, iPhone, and some Android Tablets!
jQuery nice scrollbars plugin
https://github.com/jamesflorentino/nanoScrollerJS 3. jQuery Nicescroll
The next jQuery nice scrollbars solution is Nicescroll 3. Works well on many devices and resolutions. This plugin brings styles for scrollbars, very similar to iOS.
It supports styling scrollbars of many elements: DIVs, IFrames, textarea, and certainly document page (body) scrollbars. Compatible with all desktop browsers and MANY mobile browsers.
– very stylish scrollbars, with no occupation on the window
– simple installation and activation, it works with NO modification of our code
– scroll is smooth (as modern tablet browsing, we can customize the speed)
– zoom feature
– hardware accelerated scroll (where available)
– support for touch devices
– compatibile with jQuery UI, jQuery Touch, jQuery Mobile
and many others.
https://github.com/inuyaksa/jquery.nicescroll 4. jQuery custom content scroller
Highly customizable custom scrollbar jQuery plugin, which includes vertical / horizontal scrollbar(s), adjustable scrolling speed, mouse-wheel (via jQuery mousewheel plugin), keyboard and touch support, and many other features.
jQuery nice scrollbars demos
Usage? By one line:
https://github.com/malihu/malihu-custom-scrollbar-plugin See also:
Sly scrolling plugin – a lightweight, one directional slider
jQuery content scroller plugin – customizable
CSS3 and jQuery single page scrolling plugin – singular.js
Ascensor.js – jQuery content scroller (Swiss quality)
jQuery mini help system
Enjoy jQuery nice scrollbars!