Question

I am trying to show the element using the “blind” animation:

<div onclick="$('#animatable').show('blind', null, 1000);">Click me</div>
<div style="display: none;" id="animatable">Animated</div>

But it works only once. Element appears with the blind effect, and then it disappears completely, I do not see it even in Firebug DOM! Why doesn’t it stay visible?

Some other show() animations (“explode”), work fine, but also “slide” makes the element disappear.

UPDATE:

It works fine in jsFiddle, but does not work in Firefox.

I am using jQuery UI 1.8.16 full minified file and jQuery v1.7.
I guess, I’ll try a bare page from scratch, but still waiting for suggestions if someone has already experienced such a behavior and knows why this is happening.

Answer 1

I just found the problem.

One of the many Javascript plugins was using the code from
http://www.bennadel.com/blog/1624-Ask-Ben-Overriding-Core-jQuery-Methods.htm

var originalRemoveMethod = jQuery.fn.remove;

// Define overriding method.
jQuery.fn.remove = function(){
// Log the fact that we are calling our override.
console.log( "Override method" );

// Execute the original method.
originalRemoveMethod.apply( this, arguments );
}

The problem was that it does not return any value, and somehow this breaks jquery UI.
I added

return originalRemoveMethod.apply( this, arguments );

and now it seems working fine. I just hope, this will not break something else…

So the lesson for all: do not mess the remove() function.