CODEWITHSUNDEEP
javascriptjquery
kfirba
kfirba

Reputation: 5441

jQuery animate function callback bug

I have the following code for sliding out a div:

var current = $('.s_text:visible');
current.animate({
  right: 1014,
  opacity:0,
},{queue: false, duration:2000}, function() {
  current.hide();
});

for some reason, the callback function doesn't work! but! If I remove the option {queue:false, duration:2000} and replace it with ,2000,function().... the callback function works.

current.animate({
      right: 1014,
      opacity:0,
    },2000, function() { // this one works...
      current.hide();
    });

Why is that?

Upvotes: 0

Views: 75

Answers (4)

R. Oosterholt
R. Oosterholt

Reputation: 8080

If you want to use options (queue and duration) you cannot have a callback function like that; you should include the callback function in options (see documentation):

var current = $('.s_text:visible');
current.animate({
    right: 1014,
    opacity:0
},{
    queue: false, 
    duration:2000,
    complete: function() {
        current.hide();
    }
);

Upvotes: 1

brdu
brdu

Reputation: 284

Animate:

.animate( properties, options )

Find reference here: http://api.jquery.com/animate/

var current = $('.s_text:visible');
current.animate(
  {
    right    : 1014,
    opacity  :0
  },{
    queue   : false, 
    duration:2000,
    complete: function() {
         current.hide();
    }
 });

Upvotes: 1

Chris
Chris

Reputation: 339

Because the .animate() has only two declarations:

  1. .animate( properties [, duration ] [, easing ] [, complete ] )
  2. .animate( properties, options )

none is for your useage, you could see more about .animate() here:http://api.jquery.com/animate/

Upvotes: 1

Rodik
Rodik

Reputation: 4092

If you are using the second parameter of the .animate method as an options object, you cannot send the callback as a third parameter.

In your case, you need to use the complete parameter of the options object.

var current = $('.s_text:visible');
current.animate({
  right: 1014,
  opacity:0,
},{queue: false, duration:2000, complete:function() {
  current.hide();
}});

the two optional parameter sets this method receives are:

.animate( properties [, duration ] [, easing ] [, complete ] )

or 

.animate( properties, options )

but not both at once.

source: http://api.jquery.com/animate/

Upvotes: 3

Related Questions