使用Javascript延迟和淡入文本？

我的页面中有一行我想延迟2秒并淡入。有没有一种方法可以在没有jQuery的情况下执行？使用Javascript延迟和淡入文本？

该网站是 http://theclockpage.com/ 与文中的时钟下的小线，文本通过JavaScript，这就是为什么我不把它添加到问题得到。

感谢

2011-04-25 lisovaccaro

var textCont = document.getElementById('clock').nextSibling; 
textCont.style.opacity = 0; 

setTimeout(function() { 
    var opacity = 0, 
     animate = setInterval(function() { 

      opacity += 0.05; 

      if (opacity >= 1) { 
       clearInterval(animate); 
      } 

      textCont.style.opacity = opacity; 

     }, 10); 
}, 2000);

jsFiddle。

来源

2011-04-25 05:06:49 alex

此功能不起作用。它不会正确地将字符串转换为要添加的整数。 textCont.style.opacity ='0';和textCont.style.opacity = parseInt（textCont.style.opacity）+ 0.05 +'';将工作。 – GAgnew 2011-04-25 05:12:16

@Greg jsFiddle必须做些有趣的事情然后：P – alex 2011-04-25 05:12:57

谢谢，这工作得很好！ – lisovaccaro 2011-04-25 05:19:47

var d = document.getElementById("box"); 

    function fadeOut(fadeScaler, hertz) { 
     if (!this instanceof Element) return false; 
     hertz = (!hertz) ? 60 : hertz; // Approx 60 hertz refresh rate 

     var opacity = this.style.opacity 
      opacity = "0"; 

     var t = setInterval(
      function() { 
      opacity = parseInt(opacity) + fadeScaler + ''; 

      if (parseInt(opacity) >= 1) 
       clearInterval(t); 
      }, 
      Math.floor(1000/hertz)); // 1000 miliseconds/hertz = refresh rate 
    }; 

fadeOut.apply(d, [.05]);

身份证使用这一个，亚历克斯的功能将无法正常工作。不透明度是一个字符串，不能是带整数的+ ='d。

来源

2011-04-25 05:11:05 GAgnew

我没有读取任何字符串的不透明度。 – alex 2011-04-25 05:13:49

@alex这是问题所在。不透明度是一个字符串。无论如何，在CSS和webkit中，所以这个功能是跨浏览器的。 – GAgnew 2011-04-25 05:23:08

@Greg我将它设置为'Number'' 0'。我永远不会读“不透明”属性，只需设置它。 – alex 2011-04-25 05:28:29

使用Javascript延迟和淡入文本？

回答

相关问题