This time I will share jQuery Plugin and tutorial about Small jQuery Plugin For Dynamic Image Resizing – FitMe.js, hope it will help you in programming stack.
FitMe.js is a really small jQuery plugin which automatically resizes, crops and centers your image to fit within its parent container while maintaining aspect ratio.
How to use it:
1. Make sure you have jQuery library and the jQuery Fitme.js installed correctly in your html page.
1 |
< script src = "//code.jquery.com/jquery-1.11.3.min.js" ></ script > |
2 |
< script src = "fitme.js" ></ script > |
2. Embed an image into a container.
1 |
< div class = "container" > |
3. The container must have a fixed height.
4. Call the fitMe()
method on the img
tag and done.
1 |
$( ".container img" ).fitMe(); |
Change log:
2015-08-24
- Fixed a bug: image not filling container when container size gets bigger
This awesome jQuery plugin is developed by jrmontejo. For more Advanced Usages, please check the demo page or visit the official website.