Best jQuery Scrollbar Plugins & Tutorials with Demo

    jQuery Pull-Out Content Panel with CSS3 Animation

    July 26, 2013 | CSS2 / CSS3.0, Menus, Plugins, Premium, Responsive
    jQuery Pull-Out Content Panel with CSS3 Animation

    This panel has been created to fit into any website with a clean and professional design. It can be fixed on the left or on the right and can contain any type of content : headings, texts, lists, images, videos, etc. The custom scrollbars packed in this menu will automatically appear when needed and if you need to add even more content, you can use the infinite carousel to scroll between each part of the panel.

    Features:

    • Powerful sliding side panel
    • Left or right position
    • Custom automatic scrollbars
    • Infinite sliding carousel
    • Toggle elements
    • CSS3 animations
    • Styled typography
    • Simple working contact form
    • For any type of content
    • Font-Awesome icons
    • Fits into any page
    • Clean and professional design
    • Cross-browser support
    • Designed for desktop computers, tablets and mobiles
    Read More Demo

    Scroller : jQuery plugin for replacing default browser scrollbars

    May 29, 2013 | Plugins, Web
    Scroller : jQuery plugin for replacing default browser scrollbars

    Scroller is a bare bones option for completely custom scrollbars that retain a native feel. The scrollbar can be styled using basic CSS and will fall back to the standard browser chrome if JavaScript is disabled. If you find most scrollbar replacements too bloated or convoluted for basic applications, Scroller is the answer.

    Read More Demo

    perfect-scrollbar : Tiny but perfect jQuery Scrollbar plugin

    March 7, 2013 | Plugins, Web
    perfect-scrollbar : Tiny but perfect jQuery Scrollbar plugin

    Tiny but perfect jQuery scrollbar plugin.

    Features:

    • There should be no css change on any original element.
    • The scrollbar should not affect the original design layout.
    • The design of the scrollbar should be (nearly) fully customizable.
    • If the size of the container or the content changes, the scrollbar size and position should be able to change.
    Read More Demo

    Fancy News – jQuery plugin

    February 25, 2013 | Plugins, Premium, Slider
    Fancy News - jQuery plugin

    Fancy News is a jQuery plugin that lets you create an outstanding news slider. It´s highly customizable and very easy to use. You can add umlimited of news with thumbnails. If the post is longer than the height of the main area, a cool scrollbar will be added automatically. You can also load your own RSS feed.

    Read More Demo

    Antiscroll: jQuery cross-browser native OSX Lion scrollbars

    February 7, 2013 | Plugins
    Antiscroll: jQuery cross-browser native OSX Lion scrollbars

    OS X Lion style cross-browser native scrolling on the web that gets out of the way.Antiscroll fixes a fundamental problem JavaScript UI developers commonly face: how do I customize scrollbars so that they get out of the way (for example, for different form widgets), but retain their native scrolling properties (like OS widge scrolling velocity, or OS specific inertia)?

    Antiscroll addresses this issue by providing a cross-browser implementation of the scrollbars popularized by OS X Lion that retains native properties.

    Features:

    • Supports mousewheels, trackpads, other input devices natively.
    • Total size is 1kb minified and gzipped.
    • Doesn’t magically autowrap your elements with divs (manual wrapping is necessary, please see index.html demo)
    • Fade in/out controlled with CSS3 animations.
    • Shows scrollbars upon hovering.
    • Scrollbars are draggable.
    • Size of container can be dynamically adjusted and scrollbars will adapt.
    • Supports IE7+, Firefox 3+, Chrome, Safari
    Read More Demo

    slimScroll : jQuery nice Scrollbar

    December 6, 2012 | Plugins, Web
    slimScroll : jQuery nice Scrollbar

    slimScroll is a small jQuery plugin that transforms any div into a scrollable area with a nice scrollbar – similar to the one Facebook and Google started using in their products recently. slimScroll doesn’t occupy any visual space as it only appears on a user initiated mouse-over. User can drag the scrollbar or use mouse-wheel to change the scroll value.

    Read More Demo

    VenScrollBar : A jQuery Scrollbar Plugin

    November 12, 2012 | Plugins, Premium
    VenScrollBar : A jQuery Scrollbar Plugin

    VenScrollBar is a jQuery plugin that allows web designers to replace the ugly, default OS scrollbar with custom ones that they create. All theming and customizations are done through CSS and the VenScrollBar API . The generated scrollbar completely implements the functionality of a regular scrollbar as well as offers some additional features such as auto-hiding and smooth-scrolling. This plugin is compatible with all the major browsers: IE7 +, FF3 .5+, Opera10+, Chrome5+, and Safari4+.

    Read More Demo

    jQuery DragPan

    September 12, 2012 | Animation, CSS2 / CSS3.0, Image Effects, Plugins, Premium
    jQuery DragPan

    Give your website visitors the ability to navigate a large area of rendered HTML quickly. Usefull for creating maps of supermarkets, shopping malls, theme parks, zoos, festival sites, theatres, airports, seating plans in fact anywhere where the map would be larger than the users browser.

    Features:

    • Very few images, mostly CSS
    • Includes 19 different customizable options and 3 callbacks
    • Function to move map to position
    • Doesn’t stop user from dragging beyond map, just bounces back till the whole map fills the screen
    • Scrollbars (Colour changable using CSS )
    • Copyright/help message (You choose the message)
    • Restrict to horizontal/vertical panning
    • Customize grab/grabbing cursor
    • Change return animation speed
    Read More Demo

    jQuery CoreUISelect : Easy to Stylize Select Element

    September 8, 2012 | Forms, Plugins
    jQuery CoreUISelect : Easy to Stylize Select Element

    jQuery coreUISelect is a cross browser easy to stylize select element with jQuery and CSS. Requires jQuery 1.6 or higher

    Features:

    • Full customization
    • Automatic calculations
    • Optiongroup support
    • Keyboard support
    • Powerful callback functions
    • Compatible with mobile devices
    • Support jScrollPane plugin for customize default scrollbar
    Read More Demo

    NiceScroll : jQuery Scrolling plugin for desktop,mobile & touch devices

    June 30, 2012 | jQuery Mobile, Plugins, Web
    NiceScroll : jQuery Scrolling plugin for desktop,mobile & touch devices

    Nicescroll (as nice scroll for browsers) is a jquery (since 1.5) plugin, for nice scrollbars with a very similar ios/mobile style. It supports DIVs, IFrames and document page (body) scrollbars. Compatible with Firefox 4+, Chrome 5+, Safari 4+ (win/mac), Opera 10+, IE 6+. (all A-grade browsers) Compatible with iOS devices as iPad. So you have scrollable divs for iPad.

    Read More Demo