Question

I’ve different divboxes and some pictures below them. If I hover the divboxes, they expand from 200px to 400px and the picture below slide.

So I’ve the function “theRotation” and i call two external function in it like this:

function theRotation(){
opendivs(); //this expand the divbox to 400 px
rotatePicture(); //this rotate the picture
}

now my problem is, that I want the pictures to slide if the divbox is about 300px NOT before!! (remember it expand from 200px to 400px)

So i need a event listener who tell me when the divbox.width() == 300px
Is this possible?

Kind Regards

Answer 1

call rotatePicture(); in the end of the animation you want inside opendivs() function.

For example if your code is

function opendivs() {

divbox.animate({'width':'300px'});

}

function rotatePicture() {

//rotation code

}

change opendivs() to

{

divbox.animate({'width':'300px'}, rotatePicture);

}

theRotation() must now call only opendivs() as rotatePicture() is called from opendivs().

PS
calling rotatePicture() inside opendivs() last will still not work as the function does not wait for the animation to finish.