Question

我为一个我负责的会议网站创建了这个代码。它是一个使用window.setInterval的简单淡入和淡出循环。我在firefox，safari和谷歌Chrome上测试过它。前两个只是在一段时间后停止响应，而谷歌浏览器给我一个说明说该脚本使用了太多内存。我的脚本的哪一部分使用了太多的内存，我应该如何纠正它？

由于会议网站目前用于营销，我必须恢复到我的备份副本。因此，我无法提供此问题的URL。但是，一旦我的虚拟网站上线，我就会提供一个

<span id="alertTxt" style="text-align:center; color:#CC0000; display:none">Director of Information Technology, Network Communications, Security, Smart Metering, Operations, C-Level Executives</span>
<span id="alertTxt2" style="text-align:center; color:#CC000; display:none">This Conference is for You!</span>

<script type="text/javascript">
function animateTxt() {
  $j("#alertTxt").fadeIn(2000);
  $j("#alertTxt").delay(6000).fadeOut(1500);
  animateTxt2();
  window.setInterval("animateTxt()",22000);
}
function animateTxt2() {
  $j("#alertTxt2").delay(1500).fadeIn(2000);
  $j("#alertTxt2").delay(6000).fadeOut(1500);

}
animateTxt();
</script>

Answer 1

setInterval用于设置重复计时器。如果你继续在animateTxt（）的末尾使用setInterval，那么你最终会得到很多计时器。要么将其更改为setTimeout，要么将其移出函数。

Answer 2

你应该重写这个以在完成时触发，如：

function animateTxt() {
 $j("#alertTxt").fadeIn(2000).delay(6000).fadeOut(1500, function() {
   $j("#alertTxt2").delay(1500).fadeIn(2000).delay(6000).fadeOut(1500,function(){
     animateTxt();
   });
 });
}
animateTxt();

不是排队可能会或可能不会按时完成的动画，而是以不断增长的队列结束，这会在完成时触发动画循环。您目前的方法以线性速率增长，动画开始堆叠，队列快速构建......这确保了一次只能进行一个循环。

这个fadeIn / fadeOut jQuery代码崩溃了我的浏览器 - 为什么？

2 个答案: