?
Solved

jquery find the smallest image in a row

Posted on 2014-10-27
3
Medium Priority
?
432 Views
Last Modified: 2014-10-28
Hello Experts,

I am trying to determine the smallest image (height)  in a row of images.
Then I am setting the images container to the smallest image.

So basically i am doing this as a responsive solution keeping the all the images in a row at the same height using the images container height and overflow hidden.

Here is a script i found online and i was trying to play with it yet it seems that it does not work.

Can someone take a look?

var allImages = $('.images');
var imageSmallest = allImages[0];
		
$(allImages).each(function() {

      if ($(this).height() < $(imageSmallest).height()) 
              imageSmallest = $(this);
			 
      var imageSmallestHeight = imageSmallest.height();
     $('.images-container').css("height" , imageSmallestHeight);
});	

Open in new window

0
Comment
Question by:Refael
3 Comments
 
LVL 83

Expert Comment

by:leakim971
ID: 40407520
so post a link to your page, the script look fine
0
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 40407622
Here's something I use adapted to your scenario
minH = Math.min.apply(Math, $('.some_image_class').map(function() {
	return $(this).height();
}).get());

Open in new window


minH will be the smallest height of all the images, then you need to apply that to your images

$(".some_image_class").css("height", minH)
0
 

Author Closing Comment

by:Refael
ID: 40408209
Gary, thank you. It works like a magic :-)
Just wondering what was wrong in my script?

Also thank you leakim971 for trying :-))

You both guys are the best!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

607 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question