<<  一只猪为什么会撞死在树上... | 首页 | 影响搜索引擎排名的因素2009年总览  >>

  • 用marquee实现上下滚动停顿效果

    日期：2009-08-25 | 分类：互联网

    版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
    http://ericneo.blogbus.com/logs/45068795.html

    <HTML><HEAD><TITLE>marquee上下滚动停顿效果</TITLE>

    <META http-equiv=Content-Type content="text/html; charset=gb2312">

    <META content="MSHTML 6.00.3790.118" name=GENERATOR>

     

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">

    <style>

    .title td {FONT-SIZE:14px;color: #0F0F0F;font-family: Verdana, Arial, Helvetica, sans-serif;}

    .title a:link {COLOR:#3C3C3C;TEXT-DECORATION:none;}

    .title a:visited {COLOR:#3C3C3C;TEXT-DECORATION:none;}

    .title a:active {COLOR:#3C3C3C;TEXT-DECORATION:none;}

    .title a:hover {COLOR:#0099FF;TEXT-DECORATION:none;}

    </style>

    </HEAD>

     

    <script>

    var marqueeContent=new Array();

     

    marqueeContent[0]='<img src="http://ossweb-img2.qq.com/images/web/title/dot_news.gif" width="11" height="11">&nbsp;<a href="http://www.yf321.ws" target="_blank">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX！</a><br>'

     

    marqueeContent[1]='<img src="http://ossweb-img2.qq.com/images/web/title/dot_news.gif" width="11" height="11">&nbsp;<a href=http://www.yf321.ws/mdg/ target="_blank">YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY！</a><br>'

     

    marqueeContent[2]='<img src="http://ossweb-img2.qq.com/images/web/title/dot_news.gif" width="11" height="11">&nbsp;<a href="http://www.ntearn.cn/bbs" target="_blank">ZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZ！</a><br>'

     

    var marqueeInterval=new Array();

    var marqueeId=0;

    var marqueeDelay=3000;

    var marqueeHeight=19;

    function initMarquee() {

    var str=marqueeContent[0];

    document.write('<div id="marqueeBox" style="overflow:hidden;height:'+marqueeHeight+'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>'+str+'</div></div>');

    marqueeId++;

    marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);

     

    }

    function startMarquee() {

    var str=marqueeContent[marqueeId];

    marqueeId++;

    if(marqueeId>=marqueeContent.length) marqueeId=0;

    if(document.getElementById("marqueeBox").childNodes.length==1) {

    var nextLine=document.createElement('DIV');

    nextLine.innerHTML=str;

    document.getElementById("marqueeBox").appendChild(nextLine);

    }

    else {

       document.getElementById("marqueeBox").childNodes[0].innerHTML=str;

       document.getElementById("marqueeBox").appendChild(document.getElementById("marqueeBox").childNodes[0]);

       document.getElementById("marqueeBox").scrollTop=0;

    }

    clearInterval(marqueeInterval[1]);

    marqueeInterval[1]=setInterval("scrollMarquee()",20);

    }

    function scrollMarquee() {

    document.getElementById("marqueeBox").scrollTop++;

    if(document.getElementById("marqueeBox").scrollTop%marqueeHeight==(marqueeHeight-1)){

    clearInterval(marqueeInterval[1]);

    }

    }

    </script>

    <body leftmargin="100" topmargin="100" marginwidth="0" marginheight="0" style="background-color:transparent">

    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="title">

    <tr>

       <td><script>initMarquee()</script></td>

    </tr>

    </table>

     

    </BODY></HTML>


    历史上的今天：


    随机文章：


    收藏到：Del.icio.us




    Tags：Marquee
    ERIC 发表于18:51:37 | 编辑 | 继续话题 | 转发 | 分享　0
    引用地址：