jquery突出显示淡入淡出 - 超时问题

时间:2009-06-22 11:27:34

标签: jquery settimeout jquery-animate

我在页面上有两套boxex。属于'boxOne'类的10个盒子 另有10个属于'boxTwo'类 有一个按钮。点击按钮我使用jquery效果突出显示然后淡化属于'Boxone'和'Boxtwo'类的所有元素的背景颜色。

以下是代码。

var colorOfBox1 = "'" + $(.boxOne).css('backgroundColor') + "'";  
$(.boxOne).animate(
    { 'backgroundColor': "#FF9900" }, 
    { 'queue': false, 'duration': 1000 });

setTimeout( function(){  
        $(.boxOne).animate(
          { 'backgroundColor': colorOfBox1}, 
        {'queue': false, 'duration': 2000} 
      );
}, 2000);

var colorOfBox2 = "'" + $(".boxTwo).css("backgroundColor") + "'";  
$('.boxTwo').animate({ 'backgroundColor': "#FF9900" }, {'queue': false, 'duration': 1000});  
  setTimeout(
    function(){
        $('.boxTwo).animate(  
            { 'backgroundColor': colorOfBox2 }, 
                {'queue': false, 'duration': 2000} 
          );
}, 2000);

点击按钮时,所有方框都会以指定的颜色突出显示。现在的问题是,这些方框中有时很少会消失。他们的背景仍然突出。有时会发生这种情况并没有一致 我想要一致的行为。

我看到setTimeOut()函数没有统一地应用于属于该类的所有元素......它仅适用于少数元素。
我犯了什么错?

3 个答案:

答案 0 :(得分:1)

现在我正在使用这个插件,它运行正常。

http://jquery.offput.ca/highlightFade/old.php

答案 1 :(得分:0)

也许首先检查Javascript代码的语法。不一致的语法会在不同的浏览器上导致不一致的结果。

答案 2 :(得分:0)

在某些地方,您似乎在.boxOne和.boxTwo周围缺少一些引号。不确定这是格式错误还是故意的。可能会导致某些浏览器出现问题。