jQuery Plugin To Make Images Behavior Like Backgrounds - coverimage
File Size: | 3.07 KB |
---|---|
Views Total: | 949 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

coverimage is a lightweight, cross-browser jQuery plugin for responsive web design that makes the regular images behavior like the CSS background-size : cover
attribute. The plugin will dynamically resize/crop your images and make them always be centered no matter you resize the browser window.
How to use it:
1. Add your image into a parent DIV container like this:
<div class="parent"> <img src="1.jpg" alt="Image"> </div>
2. Download the plugin and include the jquery.coverimage.js
script along with jQuery library at the bottom of the webpage.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.coverimage.js"></script>
3. Attach the plugin to the image. That's it. The plugin will automatically resize and center the image inside the DIV container '.parent' on window resize.
$('.parent img').coverImage();
This awesome jQuery plugin is developed by martinsuba. For more Advanced Usages, please check the demo page or visit the official website.