Disable Body/Content Scrolling With jQuery - disableScroll
File Size: | 5.94 KB |
---|---|
Views Total: | 7979 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
disableScroll is a very small jQuery plugin allows to temporarily disable the scrolling behaviors triggered by Mouse, Touch and Keypress events.
How to use it:
1. Include the jquery.disablescroll.js
after jQuery library and the disableScroll plugin is ready for use.
<script-src="//code.jquery.com/jquery.min.js"></script> <script-src="jquery.disablescroll.js"></script>
2. The JavaScript to prevent scroll events when you scroll a scollable element as this:
var $nonScrollable = $("#myElement"); $nonScrollable.disablescroll();
3. If you want to re-enable the scroll events in the scrollable element:
$nonScrollable.disablescroll("undo");
4. Plugin's options to enable/disable the trigger events.
var $nonScrollable = $("#myElement"); $nonScrollable.disablescroll({ handleWheel : true, handleScrollbar: true, handleKeys : true, // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36 // left: 37, up: 38, right: 39, down: 40 scrollEventKeys : [32, 33, 34, 35, 36, 37, 38, 39, 40] });
This awesome jQuery plugin is developed by realjoshharrison. For more Advanced Usages, please check the demo page or visit the official website.