当前位置:软件学堂 > 资讯首页 > 网络编程 > 编程其他 > 带链接的滚动字幕代码怎么写

带链接的滚动字幕代码怎么写

2012/10/29 11:33:37作者:佚名来源:网络

移动端

【实例名称】

带链接的滚动字幕

【实例描述】

滚动文本是新闻显示的重要手段,如果要在滚动的文本中实现链接,则需要动态设置链接文本和链接地址。本例学习如何实现带链接的滚动字幕。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页-学无忧(www.xue51.com)</title> </head> <body> <script language="JavaScript1.2"> var marqueewidth=400  //设置marquee的宽度 (in pixels) var marqueeheight=20  //设置marquee的高度 (in pixels, 该参数只适用于Netscape) var speed=4           //设置marquee滚动的速度(数值越大速度越快) //设置marquee显示内容,使用标准的HTML语法。 var marqueecontents='<strong><big>欢迎支持中国搜索引擎 <a href="http://www.baidu.com">百度一下</a> 找到自己想找的 信息</big></strong></font>' if (document.all) document.write('<marquee scrollAmount='+speed+' style="width:'+marqueewidth+'">'+marqueecontents+'</marquee>') function regenerate(){     window.location.reload();                     //重新加载页面 } function regenerate2(){     if (document.layers){     setTimeout("window.onresize=regenerate",450); //窗体改变大小时重载     intializemarquee();     } } function intializemarquee(){    //使用nobr控制显示的字符个数     document.cmarquee01.document.cmarquee02.document. write('<nobr>'+marqueecontents+'</nobr>');     document.cmarquee01.document.cmarquee02.document.close();     thelength=document.cmarquee01.document. cmarquee02.document.width;  //获取层的宽度     scrollit();                                                        //实现字体的滚动 } function scrollit(){         if (document.cmarquee01.document.cmarquee02 .left>=thelength*(-1)){         document.cmarquee01.document.cmarquee02.left-=speed;         setTimeout("scrollit()",100);                       //定时器实现不停的调用     }     else{         document.cmarquee01.document.cmarquee02.left=marqueewidth;         scrollit();     } } window.onload=regenerate2; </script> <ilayer width=&{marqueewidth}; height=&{marqueeheight}; name="cmarquee01"> <layer name="cmarquee02"></layer> </ilayer> </body> </html>

【运行效果】

运行效果

【难点剖析】

本例的重点主要包括如何动态添加链接和如何实现文本的滚动=代码中使用了一个全局变量“marqueecontents来保存链接内容和地址:文本的滚动通过定时器不断地调用“scrollit”方法实现。

【源码下载】

如果你不愿复制代码及提高代码准确性,你可以点击:带链接的滚动字幕 进行本实例源码下载 

标签: 链接  滚动字幕