jQuery - reset variable value inside .each loop

Question

I have following script:

var height = 0;
$('.scroller').each(function() {

    $(this).children('div').each(function() {

        if (height < $(this).height()) {
            height = $(this).height();
        }

    });
    $(this).css("height", height + "px");

});

What it does:

loop through each children div inside each .scroller div
height < $(this).height() = if height of the currently looped div is bigger than 0 it is setting the height of this div as new value of the height variable
this way is finding the highest div element in each .scroller div
than, the height (height of the highest element ) is set to .scroller div

The issue:

if any element inside first '.scroller' is higher than ANY element in the second .scroller it is setting the height (highest element in first .scroller) also to second scroller - example: http://jsfiddle.net/MrTest/7jAAG/20/

Is element in the first .scroller are not higher than elements in second .scroller everything works fine - example: http://jsfiddle.net/MrTest/7jAAG/16/

I think the problem is setting the height var - how can I reset this value to 0 BEFORE going to loop though second .scroller ?

Clive · Accepted Answer · 2011-09-16 14:49:34Z

5

I may be misunderstanding but could you not just do this:

$('.scroller').each(function() {
    var height = 0;
    $(this).children('div').each(function() {

        if (height < $(this).height()) {
            height = $(this).height();
        }

    });
    $(this).css("height", height + "px");

});

the height variable will then get reset for each instance of .scroller in the DOM that's looped through.

answered Sep 16, 2011 at 14:49

Clive

36.9k8 gold badges89 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jack · Accepted Answer · 2011-09-16 14:51:18Z

2

I think this might be what you are after. http://jsfiddle.net/7jAAG/30/

Set height for each iteration of .scroller.

$('.scroller').each(function() {
    var height = 0;
    $(this).children('div').each(function() {

        if (height < $(this).height()) {
            height = $(this).height();
        }

    });
    $(this).css("height", height + "px");
});

answered Sep 16, 2011 at 14:51

Jack

8,9413 gold badges23 silver badges27 bronze badges

Comments

Vincent Mimoun-Prat · Accepted Answer · 2011-09-16 14:49:27Z

0

Below is how to set height to 0 between each iteration. I don't know if the result is what you actually expect.

http://jsfiddle.net/7jAAG/24/

var height = 0;
$('.scroller').each(function() {

    $(this).children('div').each(function() {

        if (height < $(this).height()) {
            height = $(this).height();
        }

    });
    $(this).css("height", height + "px");
    height = 0;
});

answered Sep 16, 2011 at 14:49

Vincent Mimoun-Prat

28.6k16 gold badges85 silver badges126 bronze badges

Collectives™ on Stack Overflow

jQuery - reset variable value inside .each loop

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related