为什么这个jQuery在将其变为蓝色之前不会将我的文本更改为红色?

时间:2011-05-06 08:56:04

标签: jquery

我点击了部分网页时触发了以下jquery。

$('#my_link').css("color", "red").delay(500).fadeOut(500).css("color", "blue").fadeIn(500)

我可以看到大多数动画都像fadeOut和fadeIn一样发生,但我从未看到文字变成红色。我只看到它变成了蓝色。知道为什么吗?

3 个答案:

答案 0 :(得分:9)

应该是这样的:

$('#my_link').css("color", "red").delay(500).fadeOut(500, function(){
   $(this).css("color", "blue").fadeIn(500);
});

希望这会有所帮助。干杯

答案 1 :(得分:1)

执行该功能的顺序为

css red --> css blue --> fadeOut --> delay --> fadeIn

http://jsfiddle.net/dXSga/

  

.delay()方法允许我们延迟队列中跟随它的函数的执行。   这不会延迟不使用效果队列的.show().hide()的无参数形式。

简而言之,.delay()不会延迟css(),而不会使用jQuery effect

答案 2 :(得分:0)

我相信以下内容会奏效。据我所知,使用jQuery链接不会将属性与动画效果相关联。我错了。通过在淡出时使用回调,您可以创建所需的效果。

$('#my_link').css({ color : 'red' }).delay(500).fadeOut(500, function()
{
    $('#my_link').css({ color : 'blue' }).fadeIn(500);
});