S.S.Niranga
S.S.Niranga

Reputation: 364

get div height on runtime

http://gsclientlounge.co.uk/audi/facebook/lifestyle/day.php?d=4&m=5&y=2012&event_id=54#1

above url I need to change div height according to image height.

But things get worse when i am combine this with coda slider,

it want resize accordignly,

so i have put below ,

$(document).ready(function() {
    $("#controls a").click(function() {
        var hI= $(".imgGallery").outerHeight(); 
        $(".pan1").height(hI+40);
        $("#coda-slider-1").height(hI+40);
    });
});

get div height and override.

but thing is it's overriding previous slider height not current,

any solutions?

Upvotes: 0

Views: 884

Answers (2)

S.S.Niranga
S.S.Niranga

Reputation: 364

I have fixed this by adding event for gallery complete event.

Upvotes: 0

Huangism
Huangism

Reputation: 16438

I think the height is getting calculated wrong, because it is calculating the height before the slide transition. So every time you get the height of the previous slide instead of the current slide. You need to calculate the height in the animation complete function of the slider

OR

calculate the height after a delay (time it takes for the animation, I assume you defined that). So it would delay a timer of say 1000 ms, then grab the height of the slider and apply it to the containers

Edit: now I think of it, if you calculate it after the slide then it won't be as smooth because the height is applied after sliding over which means there will be a period of time where the image is cut off. So what you need to do is find out the next image's height at the time of the click, and use that as a reference point. Get all of the sliding items, then you can grab the next slide and calculate the height, when you reach the last item going forward or the first item going backwards, you need some logic to find the first item or last item.

Upvotes: 1

Related Questions