javascript竞争条件

我正在调用一个javascript函数,它可以快速连续地设置iframe的不透明度.基本上这个从0到100的alpha补间.这是代码

   function setAlpha(value)
   {
       iframe.style.opacity = value * .01;
       iframe.style.filter = 'alpha(opacity =' + val + ')';
   }

我的问题是它第一次工作在ie(7)而不是firefox(3.02).在Firefox中我得到一个延迟,然后contentdocument显示不透明度为100.如果我坚持它的工作,所以我猜它是一个竞争条件(虽然我认为javascript是单线程)和setAlpha函数在最后一个函数执行完毕之前被调用.任何帮助将不胜感激.我已经阅读了'避免javascript竞争条件',但我认为这有资格作为不同的东西(加上我无法弄清楚如何将这个例子应用到这个例子).

问题是大多数浏览器在javascript执行暂停之前不会重新绘制.

这可以通过使用setTimeout来解决,正如其他人所建议的那样.但是,我建议使用jQuery或任何javascript库之类的东西来制作动画.运行setTimeout 100次是一个坏主意,因为动画的长度将根据浏览器和用户计算机的速度而变化.执行动画的正确方法是指定它们应该持续多长时间并检查系统时间以确定动画应该进展多远.

function fadeIn(elem,animation_length) {
   var start = (new Date()).getTime();

   var step = function() {
      window.setTimeout(function() {
        var pct = ((new Date()).getTime() - start)/animation_length;
        elem.style.opacity = Math.min(pct,1);
        if (pct < 1) 
           step();
      },20);
   };
   step();
}

[编辑:]上面的代码只是为了说明如何根据系统时钟而不是简单的间隔来制作动画.请使用库来制作动画.上面的代码不适用于IE,因为IE使用"filter:opacity(xx)"而不是"opacity".图书馆将为您处理此事,并提供诸如完成事件和取消动画的功能等优秀功能.