Forums

cssfreak

Hey Guys i need a solution for the following problem

i have a javascript file which i use to display a modal box using jQuery doing all the animation effects and stuff

right after all the animation effects i have a javascript statement

something like this


$('div#modal').animate({left:w,top:h,width:modalW,height:modalH},\"slow\");
document.formName.submit();

This is just an example......

ma problem now is the the second statement executes before animation is completed
is there any why i could finish the animation and then make the javascript to execute ???

Hugo

You can use the built-in callback function to achieve this. Animate takes a total of four arguments: animate( params, [duration], [easing], [callback] ). The most popular are the first two, 'params' and 'duration' (you've used these as well). You can add a callback function that will execute upon completion of your animation. So the new code would be like this:


$('div#modal')
     .animate(
          {
               left : w,
               top : h,
               width : modalW,
               height : modalH 
          },
          \"slow\",
          function(){
               document.formName.submit();
          }
     );
//duration, easing and callback are all optional, 
//so you can just leave out one and use another like I did above ('easing' was left out)

That should do the trick. You might also want to have a look at jQuery thickbox, which is a very nice modal box plugin developed by Cody Lindley - member of the jQuery team.

cssfreak

Thanks for the reply Hugo ...i realised it minutes before i saw this reply......anyways i appreciate ur response....thanks

treehouse : what would you like to learn today?

Forums

javascript problem