用淡入旋转文字

时间:2013-06-12 18:45:59

标签: text fading

我目前有此代码用于显示随机客户推荐。 我想用一个代码替换随机函数,该代码将按顺序显示引号,然后重复它们。

<html style="direction:rtl;">
  <DIV id=textrotator style="FONT: 16px arial ; text-align:right; WIDTH: 100%; COLOR: rgb(255,255,255)"></DIV>
  <body bgcolor="#FFFFFF" alink="#FFFFFF" vlink="#FFFFFF" topmargin="0" leftmargin="0" rightmargin="0">
  <script type = "text/javascript">
    var hexinput = 255; // initial color value.

    quotation = new Array()
    quotation[0] = "text1"
    quotation[1] = "text2"
    quotation[2] = "text3"

    function fadingtext()
    { 
      if(hexinput >111) 
      { 
        hexinput -=11; // increase color value
        document.getElementById("textrotator").style.color="rgb("+hexinput+","+hexinput+","+hexinput+")"; // Set color value.
        setTimeout("fadingtext()",200); // 200ms per step
      }
      else 
      {
        hexinput = 255; //reset hex value
      }
    }

    function changetext()
    {
      if(!document.getElementById){return}
      var which = Math.round(Math.random()*(quotation.length - 1)); 
      document.getElementById("textrotator").innerHTML = quotation[which]; 
      fadingtext();
      setTimeout("changetext()",8000); 
    }

    window.onload = changetext();
  </script>

1 个答案:

答案 0 :(得分:1)

您需要将索引设为全局。将which抛出函数外部,然后将其递增,确保在结束时换行。

这是“changetext”功能的替代品:

var which = 0;

function changetext()
{
    which += 1; 
    if (which >= quotation.length)
    {
        which = 0;
    }

    document.getElementById("textrotator").innerHTML = quotation[which]; 

    fadingtext();

    setTimeout("changetext()",8000);
}