Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery. how to get each siblings height?

I think this is very easy question for someone who is more experienced in Jquery.

for example we have simple html page with a few divs, and 3 of them have the same css class 'sidebar'

Each of this 'sidebar' divs have different content and different height.

I need to compare this divs height and find the longest one.

I know how to realize comparing, but I do not know how in Jquery I can take each of this divs

to store their value in vairable or array.

like image 451
Akhmed Avatar asked Jul 16 '10 03:07

Akhmed


People also ask

How to get siblings in jQuery?

jQuery siblings() MethodThe siblings() method returns all sibling elements of the selected element. Sibling elements are elements that share the same parent. The DOM tree: This method traverse forward and backwards along siblings of DOM elements.

How to get width and height in jQuery?

jQuery width() and height() MethodsThe width() method sets or returns the width of an element (excludes padding, border and margin). The height() method sets or returns the height of an element (excludes padding, border and margin).

How to get width of element using jQuery?

jQuery width() Method The width() method sets or returns the width of the selected elements. When this method is used to return width, it returns the width of the FIRST matched element. When this method is used to set width, it sets the width of ALL matched elements.

Which jQuery Methods are used to get or set the width and height of an html element including the paddings?

outerWidth() - Returns the width of an element (includes padding and border). outerHeight() - Returns the height of an element (includes padding and border).


2 Answers

I'm not sure why the two answers posted so far are using jQuery.each() rather than just calling each() directly, so here's what I would recommend:

$('#elementID').siblings().each(function ()
{
    var height = $(this).height();
});

To put each height into an array:

var heights = [];
$('#elementID').siblings().each(function ()
{
   heights.push($(this).height());
});

Or, just use map():

var heights = $('#elementID').siblings().map(function ()
{
   return $(this).height();
}).get();
like image 169
Matt Ball Avatar answered Sep 21 '22 20:09

Matt Ball


$.each($('.sidebar'), function() {
    var height = $(this).height();
});
like image 44
Calvin Avatar answered Sep 20 '22 20:09

Calvin