开发者

this fadeIn / fadeOut jQuery code crashes my browsers- Why?

I created this code for a conference website that I had been tasked to do. It is a simple fade in and out loop using window.setInterval. I've tested it on firefox, safari and google Chrome. The first 2 just stop responding after awhile, while google chrome gives me a note saying that the script uses too much memory. Which part of my script is using too much memory and how should I rectify it ?

As the conference site is currently used for marketing, I have to revert to my backup copy. Therefore, I am unable to give a URL for this problem. I will, however, provide one as soon as I get my dummy site up

<span id="alertTxt" style="text-align:center; color:#CC0000; display:none">Director of Information Technology, Network Comm开发者_如何学编程unications, 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>


setInterval is used to set a repeating timer. if you keep using setInterval at the end of animateTxt() then you'll end up with lots of timers. either change it to setTimeout or move it out of the function.


You should re-write this to trigger when complete, like this:

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

Instead of queuing animations that may or may not finish on time, ending up in a growing queue, this triggers the animation to loop when complete. The method you currently have grows at linear rate, and animations begin stacking up and the queue builds fast...this ensures only one cycle is going at a time.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜