This time I will share jQuery Plugin and tutorial about jQuery Plugin To Pan Html Element within Viewport – Porthole, hope it will help you in programming stack.
Porthole is a jQuery plugin which allows the visitor to pan html elements inside a specified viewport using mouse drag or touch gestures, based on CSS3 transforms.
How to use it:
1. Add the latest version of jQuery library and the jQuery Porthole plugin to your web pages.
1 |
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script> |
2 |
<script src="dist/jquery.porthole.js"></script> |
2. The html structure.
2 |
<div class='element-to-pan'></div> |
3. Call the function on the top element to enable the plugin.
01 |
$('#viewport').porthole({ |
07 |
callback: function() { |
08 |
console.log('loaded'); |
Change log:
2015-10-13
- bugfix
- es6 modules support
This awesome jQuery plugin is developed by DmitryFillo. For more Advanced Usages, please check the demo page or visit the official website.
