2012-05-14 186 views
0

我有以下淡入淡出的代码,它使我可以淡入白色到黑色的文本,但在我的网站上我有一个背景背景,并且需要将这个从黑色变为白色,任何人都可以帮忙。 。黑色背景上的褪色文本

<html> 
<head> 
<title>Fading Text Example</title> 
<script language="javascript"> 
var hcolor=255; 
function Fade(direction) { 
obj=document.getElementById("head1"); 
hcolor += direction; 
if (hcolor >= 0 && hcolor < 256) { 
hex=hcolor.toString(16); 
if (hex.length==1) hex="0" + hex; 
obj.style.color="#" + hex + hex + hex; 
window.setTimeout("Fade(" + direction + ");",1); 
} 
} 
</script> 
</head> 
<body onLoad="Fade(1);"> 
<h1 ID="head1" style="color:#FFFFFF;"> 
Fading Text Example</h1> 
</body> 
</html> 
+0

你为什么不使用jQuery'fadeIn' API? http://api.jquery.com/fadeIn/ – Bongs

回答

0

看来已经功能包括对指定方向的能力,只是通过在-1,而不是1,并设置初始hColor为0的节点,在下面我也编辑的格式稍微清理变量名称并使其略微更清晰/更符合要求。

<html> 
    <head> 
     <title>Fading Text Example</title> 
     <script language="text/javascript"> 
      var hColor=0; 
      function fade(direction) { 
       obj=document.getElementById("head1"); 
       hcolor += direction; 
       if ((hColor >= 0) && (hColor < 256)) { 
        hex=hColor.toString(16); 
        if (hex.length==1) hex="0" + hex; 
        obj.style.color="#" + hex + hex + hex; 
        window.setTimeout("fade(" + direction + ");",1); 
       } 
      } 
     </script> 
    </head> 
    <body onload="fade(-1);"> 
    <h1 id="head1" style="color:#FFFFFF;">Fading Text Example</h1> 
</body>