0

I am trying to animate a div to move to top when I click a link. And when I click another link it should animate back to it;s original position and fade out.

I uses jquery to center the div.. now the Point is, when i click a link it works fine, say 40 px up.. And I set to move that div down when I click the second link..

The problem is what if I click the second link, the div image moves down as I wrote the event handler for it..

How do I detect that div has moved before or not? Like when I click the first link and then the second the div operates fine.. but if I click the second one, it goes down and it disappears from screen.

Improve this question

2 Answers 2

Reset to default
1

Simple, in the first animation callback just add a class to the div like anim-done and on the event handler for the second click, check for this class before animating it back to it's original position and fading it out. Make sure to remove this class in the callback for the second animation.

Here's the fiddle to help clarify: http://jsfiddle.net/G5JcA/

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

2 Comments

it's quite confusing, can you fiddle it?? i am newbie.. thanks for the support.
@designerNProgrammer Added fiddle. Cheers!
0

You can use success function after the animation is over

Below is the syntax

.animate({co-ords},time,successfuntion);

refer to this fiddle which fades out the div after moving to the left

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.