半尺寸<br/>在我的javascript旋转文本中淡入

时间:2013-11-26 01:41:05

标签: jquery css text-rotating

我通过网络上找到的代码建立了一个淡入淡出的旋转文本,我只有基本的代码理解。

报价[2]需要三条线,而其他只需要两条线,因此它会在旋转时上下移动网站。无论如何在这个代码中设置一半,所以我可以在句子的上方和下方有半个空格?或仅以第三个报价为中心。

我尝试使用span 0.5em方法的css,但是这个代码的其余部分内的span不起作用。

感谢

(网站是www.focallocal.org)

<DIV id=textrotator style="FONT: 18px arial ; text-align:centre; 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] = "<br />A simple and fun way to make the world and your community a happier, more connected place in your free time<br /><br />" 
    quotation[1] = "<br />Discover how you can shape the world in your spare time through Collective Action<br /><br />"
    quotation[2] = "Bringing people and their communities closer together and dealing with serious societal issues in a constructive, light-hearted, adventurous and enjoyable way"

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

 var which = 0;

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

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

    fadingtext();

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

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

0 个答案:

没有答案