Simple Image Zoom & Crop Plugin with jQuery and Velocity.js - enhance.js

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

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:

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.