Callback of .animate() gets called twice jquery

by

To get a single callback for the completion of multiple element animations, use deferred objects.

$(".myClass").animate({
  marginLeft: "30em"
}).promise().done(function(){
  alert("Done animating");
});

When you call .animate on a collection, each element in the collection is animated individually. When each one is done, the callback is called. This means if you animate eight elements, you’ll get eight callbacks. The .promise().done(...) solution instead gives you a single callback when all animations on those eight elements are complete. This does have a side-effect in that if there are any other animations occurring on any of those eight elements the callback won’t occur until those animations are done as well.

See the jQuery API for detailed description of the Promise and Deferred Objects.

More Related Contents:

  1. jQuery callback for multiple ajax calls
  2. How can I run a directive after the dom has finished rendering?
  3. wait for a jquery ajax callback from calling function
  4. jQuery Plugin: Adding Callback functionality
  5. Extracting Ajax return data in jQuery
  6. How to attach callback to jquery effect on dialog show?
  7. jquery callback function only working on last loop
  8. Edit datatable in shiny with dropdown selection (for DT v0.19)
  9. Is there a callback for Twitter’s Tweet Button?
  10. Backbone.js Event Binding
  11. in Jquery how to run code with callback before submit
  12. how to get source of a page
  13. Slide down button to show text HTML CSS
  14. CORS issue – No ‘Access-Control-Allow-Origin’ header is present on the requested resource
  15. jQuery: outer html() [duplicate]
  16. Queue ajax requests using jQuery.queue()
  17. Posting JSON data via jQuery to ASP .NET MVC 4 controller action
  18. jQuery: fire click() before blur() event
  19. Is there a jquery event that fires when a new node is inserted into the dom?
  20. How to implement “mustMatch” and “selectFirst” in jQuery UI Autocomplete?
  21. onHide() type event in jQuery
  22. how to test Recaptcha with jQuery Validate plugin
  23. When using Ajax with jQuery DataTables, how do I determine what to do with the data returned?
  24. How to add data via $.ajax ( serialize() + extra data ) like this
  25. disable a hyperlink using jQuery
  26. jQuery Validation – Two fields, only required to fill in one
  27. sum all values for table column based on class
  28. Different forms of $(document).ready
  29. jquery resize listener on a div
  30. How to create a diagonal line within a table cell?

Leave a Comment