discrepencies in animations with duration of 0 milliseconds

[arthur.lawry]

The other day I was working with changing the opacity of a link on hover: setting it initially to 40% while hovering over brought it to 100% immediately and leaving gradually returned the opacity to 40%.

My html looks like this:

<a class="the_link" style="background-color:red">the link</a>

My jquery, inside a document ready function, looks like this:

$(".the_link").animate({opacity : 0.4},0).hover(function(){
        $(this).stop().animate({opacity : 1),0);
}, function(){
        $(this).stop().animate({opacity : 0.4),500);
});

When my page loaded, I noticed the initial instantaneous change in opacity from 100% to 40%. However, when I hovered over the link, the animation to 100% opacity took approximately half a second (unintended), as did the animation back to 40% (intended).

It appears to me that in the first animation of duration 0, the 0 is correctly interpreted as 0 milliseconds, whereas in the second hover over animation, the same 0 is being interpreted as a boolean false which is resulting in an animation that believes no duration is specified and uses the default animation speed (250-500ms it looks like to me).

I had no problem fixing this problem by specifying both animations to take 1 millisecond, but it seems that there may be instances where the value 0 is interpreted differently for the animation duration.

Please feel free to contact me if you have additional questions.

[flesler]

When speed is 0, it's evaled as false, so the default (400 ms) is used. While this could be "fixed", an animation of 0ms doesn't make sense, as it's not an animation.

You might want to use $().css() instead of animate() with 0.

I'll close, reopen if you have something else to say.