Momentum Panning and Zooming Effect With jQuery - zoom3d
File Size: | 10 KB |
---|---|
Views Total: | 1894 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

zoom3d is a simple jQuery plugin that enables momentum panning and zooming effects on your html content in mobile browsers.
How to use it:
1. Include both jQuery JavaScript library and the jQuery zoom3d plugin on your webpage.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/js/jquery.zoom3d.js"></script>
2. Wrap the html content into the container 'zoom3d'.
<div class="zoom3d"> <div class="content"> ... </div> </div>
3. Just call the function on the top container and done.
$(".zoom3d").zoom3d({ content: ".content", translate3d: true });
4. Plugin's default settings.
$(".zoom3d").zoom3d({ accelerationRatio: 0.0005, content: "", doubleClickTime: 200, bounceLimit: 100, maxScale: 2, midScale: 1, momentumTime: 200, translate3d: false });
Changelog:
2016-10-17
- Minor refactoring and optimization
2016-02-12
- bugfix
This awesome jQuery plugin is developed by riomyers. For more Advanced Usages, please check the demo page or visit the official website.