Touch Enabled Content Scrolling Plugin With jQuery - jscroll

jscroll is a super tiny jQuery plugin that allows the visitor to scroll vertically or horizontally through html content within a specified container. Supports both mouse drag and touch swipe events.

Basic usage:

1. Create a scrollable container like this:

<div id="demo">
  <p>...</p>
</div>

#demo {
  width:300px;
  height:300px;
  overflow:auto
}

2. Add the required CSS style to your HTML page:

.jScroll {
  overflow: hidden;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

3. Load jquery.js and jquery.jscroll.js in the html page.

<script src="jquery.min.js"></script>
<script src="script/jquery.jscroll.js"></script>

4. Run as JavaScript class.

new jScroll('#demo');

5. Run as jQuery plugin.

new jScroll('#demo');

6. Possible plugin options.

$('#demo').jScroll({

  // 'h': horizontal scrolling
  // 'v': vertical scrolling
  type  : 'h',

  // width / height of the scrollable area
  width : null,
  height  : null
  
});

---

This awesome jQuery plugin is developed by tofupapa. For more Advanced Usages, please check the demo page or visit the official website.