Simple Image Zoom & Crop Plugin with jQuery and Velocity.js - enhance.js
File Size: | 8.01 KB |
---|---|
Views Total: | 3624 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Just another jQuery Medium-style image zoom plugin that uses CSS3 object-fit / object-position for smart image resizing and the Velocity.js for accelerated JavaScript animations. Heavily based on jQuery zoom.js plugin.
See also:
- Medium Style Image Zoom Plugin with jQuery - zoom.js
- Simple jQuery Plugin For Medium.com Style Image Lightbox - simplezoom
How to use it:
1. Load the required stylesheet zoom.css
in the head section of the document.
<link rel="stylesheet" href="css/zoom.css">
2. Load jQuery library and other required resources at the bottom of the document.
<script src="jquery.min.js"></script> <script src="velocity.min.js"></script> <script src="js/enhance.js"></script>
3. Add the data-action="zoom"
attribute to your images.
<img src="1.jpg" data-action="zoom">
4. Use the image cropping class 'cropped' to resize the images while preserving aspect ratio.
<img src="1.jpg" data-action="zoom" class="cropped">
This awesome jQuery plugin is developed by ROUND. For more Advanced Usages, please check the demo page or visit the official website.