jQuery Pause / Resume animate

问题

This ain't working for me...

$(document).ready(function(){
    $('#h .a').animate({
        top:'-=80px'
    },90,'linear');

    $('#h .au,#h .di').animate({
        left:'-=80px'
    },50000000,'linear');

    $('#h .r').animate({
        left:'-=80px'
    },250,'linear');

    $("#h").animate('pause'); //pausing it at the start
    //resume pause switch
    $("#h").mouseover(function(){
      $(this).animate('resume');
    }).mouseout(function(){
      $(this).animate('pause');
    });

});

回答1:

Check out the demo here: http://api.jquery.com/clearQueue/

Looks like exactly the sort of thing you're trying to do.

回答2:

try this one for pause and resume: jQuery Pause / Resume animation plugin

also we $(this).stop() can pause animate but no chance to resume!

other mistake is this one: top:'-=80px'

first try to get current position like this then add position to it:

_top = $(this).offset().top;

$('#h .a').animate({
    top:_top-80
},90,'linear')

回答3:

Check the plugin: Fxqueues

https://github.com/lucianopanaro/jQuery-FxQueues

It supports both pause and resume (without clearing the queue) and adds the idea of Scopes. Scopes are great for chaining animations across multiple objects.

I haven't found a version of Fxqueus for the current version of Jquery, but have used it successfully with older Jquery versions.

回答4:

You'll want to look into using the .stop() function for this, as it'll stop any animations on a jQuery element.

http://api.jquery.com/stop/

回答5:

Use queue() and dequeue() functions. Here's an example taken directly from jQuery documentation.

Check working example at http://jsfiddle.net/j4SNS/

来源：https://stackoverflow.com/questions/5586068/jquery-pause-resume-animate