CODEWITHSUNDEEP
javascriptjquery
styler
styler

Reputation: 16481

jquery reset the css value of an animation?

I have a created a snippet of code that basically animates an h2 onto an image on hover and then off the right on hover off, so i've initially set the h2 to be left: -200px off the page on load, then on hover to animate to left: 10px inside the .image and then on hover off to animate to left: 500px to zoom off. Now when I hover the image again the h2 is being animated in from the right, how can I reset the h2 to be -200px as soon as the hover off has happened or can you suggest a better way for me to achieve this effect?

My attempt can be found here http://jsfiddle.net/kyllle/GPve7/

Thanks

Upvotes: 1

Views: 3628

Answers (2)

Sleeperson
Sleeperson

Reputation: 612

Just reset the position after the second animation is finished using the callback argument in animate() like here http://jsfiddle.net/geko/GPve7/9/

Upvotes: 1

Kristoffer Sall-Storgaard
Kristoffer Sall-Storgaard

Reputation: 10636

Look at the animate function from jquery, it has a callback property, just set the CSS after that:

Updated fiddle

Upvotes: 5

Related Questions