A hammer.js & Jquery based Touch Event Enabled Image Viewer Plugin with Pan and Pinch Zoom Support,
- Added Support for HTML MAPS, Which will auto postion and size anchros according to zoom level.
Sample Usage:
<div class="img_cotainer" style="overflow:hidden;width:100px;height:100px">
<img src="assets/image.jpg" usemap="#image-map">
<map name="image-map">
<area target="" alt="" title="" href="http://example.com/" coords="1909,3816,2026,4061" shape="rect">
</map>
</div>
Usage :
include jquery and hammer.js
include our js plugin
<div class="img_cotainer" style="overflow:hidden;width:100px;height:100px">
<img src="my_big_image.jpg" style="width:inherit;height:inherit" />
</div>
Usage :
$(".img_cotainer").beepPanZoom();
Some Options :
ZOOM : initial Zoom
MIN_SCALE : Minimum Allowed Scale
MAX_SCALE : Maxmium Allowed Scale
*Example :
$(".img_cotainer").beepPanZoom({ZOOM:1/2,
MIN_SCALE:0,
MAX_SCALE:5});
Sorry, too lazy right now...