Skip to content

Instantly share code, notes, and snippets.

@influxweb
Created June 19, 2013 15:27
Show Gist options
  • Save influxweb/5815208 to your computer and use it in GitHub Desktop.
Save influxweb/5815208 to your computer and use it in GitHub Desktop.
Image resizing using jQuery Although you should resize your images on server side (using PHP and GD for example) it can be useful to be able to resize images using jQuery. Here’s a handy code snippet to do it. http://www.catswhocode.com/blog/useful-jquery-code-snippets
$(window).bind("load", function() {
// IMAGE RESIZE
$('#product_cat_list img').each(function() {
var maxWidth = 120;
var maxHeight = 120;
var ratio = 0;
var width = $(this).width();
var height = $(this).height();
if(width > maxWidth){
ratio = maxWidth / width;
$(this).css("width", maxWidth);
$(this).css("height", height * ratio);
height = height * ratio;
}
var width = $(this).width();
var height = $(this).height();
if(height > maxHeight){
ratio = maxHeight / height;
$(this).css("height", maxHeight);
$(this).css("width", width * ratio);
width = width * ratio;
}
});
//$("#contentpage img").show();
// IMAGE RESIZE
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment