當(dāng)前位置：軟件學(xué)堂 > 資訊首頁 > 網(wǎng)絡(luò)編程 > 編程其他 > 帶鏈接的滾動字幕代碼怎么寫

帶鏈接的滾動字幕代碼怎么寫

2012/10/29 11:33:37作者：佚名來源：網(wǎng)絡(luò)

移動端

【實(shí)例名稱】

帶鏈接的滾動字幕

【實(shí)例描述】

滾動文本是新聞顯示的重要手段，如果要在滾動的文本中實(shí)現(xiàn)鏈接，則需要動態(tài)設(shè)置鏈接文本和鏈接地址。本例學(xué)習(xí)如何實(shí)現(xiàn)帶鏈接的滾動字幕。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁-學(xué)無憂（yzddtk.cn）</title>
</head>
<body>
<script language="JavaScript1.2">
var marqueewidth=400  //設(shè)置marquee的寬度 (in pixels)
var marqueeheight=20  //設(shè)置marquee的高度 (in pixels, 該參數(shù)只適用于Netscape)
var speed=4           //設(shè)置marquee滾動的速度(數(shù)值越大速度越快)
//設(shè)置marquee顯示內(nèi)容，使用標(biāo)準(zhǔn)的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控制顯示的字符個數(shù)
    document.cmarquee01.document.cmarquee02.document.
write('<nobr>'+marqueecontents+'</nobr>');
    document.cmarquee01.document.cmarquee02.document.close();
    thelength=document.cmarquee01.document.
cmarquee02.document.width;  //獲取層的寬度
    scrollit();                                                        
//實(shí)現(xiàn)字體的滾動
}
function scrollit(){
        if (document.cmarquee01.document.cmarquee02
.left>=thelength*(-1)){
        document.cmarquee01.document.cmarquee02.left-=speed;
        setTimeout("scrollit()",100);                       
//定時器實(shí)現(xiàn)不停的調(diào)用
    }
    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>

【運(yùn)行效果】

運(yùn)行效果

【難點(diǎn)剖析】

本例的重點(diǎn)主要包括如何動態(tài)添加鏈接和如何實(shí)現(xiàn)文本的滾動=代碼中使用了一個全局變量“marqueecontents來保存鏈接內(nèi)容和地址：文本的滾動通過定時器不斷地調(diào)用“scrollit”方法實(shí)現(xiàn)。

【源碼下載】

如果你不愿復(fù)制代碼及提高代碼準(zhǔn)確性，你可以點(diǎn)擊：帶鏈接的滾動字幕 進(jìn)行本實(shí)例源碼下載 

標(biāo)簽： 鏈接  滾動字幕