CODEWITHSUNDEEP
jqueryjquery-animate
Jukke
Jukke

Reputation: 349

Start animation after its been stopped

The code below stops an animation, I would like be able to start it again thou, on mouseleave

$(function animate(){
$(".block").animate({left: '+=500px'}, 2000);
$(".block").animate({left: '0px'}, 1, animate);
});

$(".block").mouseenter(function(){
$(".block").stop( true, false);
});

$(".block").mouseleave(function(){
animate();//This does not work
});

Upvotes: 2

Views: 3679

Answers (2)

Jason Spick
Jason Spick

Reputation: 6098

Try Hover to activate the animation.

$(".block").hover(stop(),start());
function stop(){
  $(".block").stop( true, false);
});
function start(){
  $(".block").animate({left: '+=500px'}, 2000);
  $(".block").animate({left: '0px'}, 1, animate);
});

Upvotes: 0

jabley
jabley

Reputation: 2222

I think you're trying to access a named function in a scope in which it's not defined?

function animate(){
  $(".block").animate({left: '+=500px'}, 2000);
  $(".block").animate({left: '0px'}, 1, animate);
};

$(animate);

$(".block").mouseenter(function(){
  $(".block").stop( true, false);
});

$(".block").mouseleave(function(){
  animate();
});

I've created this example, which may help you iterate to a working solution.

Upvotes: 2

Related Questions