CODEWITHSUNDEEP
javascriptjquerycss
Sam Skirrow
Sam Skirrow

Reputation: 3697

jQuery resize all images with a certain class to be square

My page content is dynamically created, I am trying to write a script that searches for all images in a container 'image-rounded', and if they are not square, change either the height or width to make them square (based on the size of the smallest edge).

Here is my script so far:

jQuery(function($) { 
  $('.wrapper-site').find('.image-rounded img').each(function () { 
    var round_image_width = $(this).width();
    var round_image_height = $(this).height();

if(round_image_height > round_image_width) {
  $(this).css('height', 'round_image_width');
} else {
  $(this).css('width', 'round_image_height');
}

  });  
});

But currently this does nothing.

Upvotes: 1

Views: 626

Answers (1)

George Kagan
George Kagan

Reputation: 6124

$(this).css('height', 'round_image_width');

should be

$(this).css('height', round_image_width);

Same for the height... Happens to the best of us :)

Upvotes: 4

Related Questions