$("a").hover(function(){
    $(this).animate({left: '-500px'}, 'slow');
);

I use this code to animate position of the link. I move it to the left corner with slow animation speed.

How do I change speed of this animation to fast, when link is clicked?

We should get:

• slow animation when link is hovered.
• fast when it is clicked.

The problem is, link can be already animated, when we try to click on it. What do you think?

Thanks.

$("a").hover(function(){
    $(this).animate({left: '-500px'}, 'slow');
);

I use this code to animate position of the link. I move it to the left corner with slow animation speed.

How do I change speed of this animation to fast, when link is clicked?

We should get:

• slow animation when link is hovered.
• fast when it is clicked.

The problem is, link can be already animated, when we try to click on it. What do you think?

Thanks.

• javascript
• jquery
• html
• animation
• jquery-animate

• you can specify the time interval as a second argument...that will take care – kobe Commented May 8, 2011 at 17:47

3 Answers 3

$("a").hover(function(){
    $(this).animate({left: '-500px'}, 'slow');
).click(function() {
    $(this).dequeue().animate({left: '-500px'}, 'fast');
});

You could try:

$("a").click(function(){
    $(this).stop(true).animate({left: '-500px'}, 'fast');
);

(Not tested)

This might work, using stop() to stop any animation already running.

$("a").click(function(){
    $(this).stop()
    $(this).animate({left: '-500px'}, 'fast');
);