jQuery Plugin For Drag To Scroll Functionality - dragScroll
File Size: | 4.18 KB |
---|---|
Views Total: | 6485 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
dragScroll is a dead simple jQuery plugin which enables the panning (drag to scroll) functionality on your scrollable container.
How to use it:
1. Create a scrollable container as follows:
<div class="container"> <div class="scroller"> <div class="wrapper"> <div> 1 </div> <div> 2 </div> <div> 3 </div> <div> 4 </div> <div> 5 </div> <div> 6 </div> <div> 7 </div> <div> 8 </div> <div> 9 </div> <div> 10 </div> ... <div> n </div> </div> </div> </div>
2. Put jQuery JavaScript library and the jQuery dragScroll plugin's script at the end of the document.
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"> </script> <script src="dragScroll.js"></script>
3. Enable the drag to scroll functionality on the container.
var $container = $(".container"); var $scroller = $(".scroller"); bindDragScroll($container, $scroller);
This awesome jQuery plugin is developed by Pong420. For more Advanced Usages, please check the demo page or visit the official website.