jQuery fadeIn在Firefox中闪烁

我正在使用fadeIn在用户单击后展开表格中的行。在Chrome甚至IE中一切正常，但在Firefox 15.0.1中不起作用。在FF中，展开后的行在淡入后背景中闪烁一次。jQuery fadeIn在Firefox中闪烁

这里是我的代码：

$('.patients-items-item').click(function() { 
    var item = $(this).next('.toggle-item'); 

    if (item.is(":visible")) { 
     item.hide(); 
    } else { 
     item.fadeIn(); 
    } 
});

HTML：

<table class="patients-table"> 
    <tbody class="patients-items"> 
     <tr class="patients-items-item"> 
      <td> 
       <span class="button collapsed"></span> 
      </td> 
      <td> 
       Text 
      </td> 
      <td > 
       Text2 
      </td> 
     </tr> 
     <tr class="toggle-item"> 
      <td colspan="3" class="patients-studies-empty"> 
       Text3 
      </td> 
     </tr> 
    </tbody> 
</table>

看那Fiddle。

调查期间，我发现这种行为只出现在表格中。如果我对divs做了同样的处理，那么代码在所有浏览器中都能正常工作。

任何建议将有所帮助。

来源

2012-10-11 Artem Vyshniakov

其实我没有看到你的jsfiddle任何闪烁 – Sutuma

你使用FF 15？ –

已确认在FF 13上闪烁，但在IE9或最新的Chrome上没有任何显示。 –

在jQuery中可以使用切换（）功能得到你想要的行为。

见这里的例子：

http://jsfiddle.net/83tNC/

$('.patients-items-item').on('click', function() { 

    $(this).next('.toggle-item').toggle('fade'); 

});

来源

2012-10-11 15:11:13

谢谢。有用。 –

不客气。 –

你为什么不尝试

item.stop().fadeIn();

此外，如果你正在切换，你为什么不使用：

item.stop().fadeToggle("slow", "linear");

来源

2012-10-11 15:10:06

当然，我尝试了这些东西，但它们的工作原理是相同的，并没有解决问题。 –

jQuery fadeIn在Firefox中闪烁

回答

相关问题