單行的JS文字滾動(dòng)條

2024-09-05 12:21:22

字體：大中小

供稿：網(wǎng)友

文字在一行的文字滾動(dòng)效果，不間斷無(wú)縫滾動(dòng)，效果很好，不過有一點(diǎn)不太好，就是用JS輸出了表格，好像修改起來(lái)不方便，特別是對(duì)JS不太熟的朋友。

<html><head><title>單行的JS文字滾動(dòng)條</title><meta http-equiv="content-Type" content="text/html;charset=gb2312"><STYLE>A {  COLOR: #aa0000  }  A:hover {  COLOR: #ff0000  }</STYLE></head><body onload="initiate()"><SCRIPT language="JavaScript1.2">var message= new Array()message[0]="你知道嗎？|太陽(yáng)什么時(shí)候出生的？"message[1]="今日提示：|我國(guó)東北有大雨！"message[2]="今日更新：|請(qǐng)注意訪問網(wǎng)址查看！"http:// 卷軸高  var scrollerheight=25// 標(biāo)題寬  var titlezonewidth=80// 說明寬  var copyzonewidth=340// 距離窗口頂  var scrollertop=20// 距離窗口左  var scrollerleft=20var scrollerborder=2// 標(biāo)題背景色  var titlezonebg="330066"http:// 文字的背景色  var copyzonebg="CC0000"http:// 卷軸的背景色  var scrollbg="AAAAAA"http:// 目標(biāo)窗口  var targetlink="_blank"http:// 標(biāo)題的字體屬性  var font_titleface="宋體"  var font_titlecolor="FFFFFF"  var font_titlesize=2// 說明的字體屬性  var font_copyface="宋體"  var font_copycolor="FFFFFF"  var font_copysize=2// s設(shè)置 1 標(biāo)題為粗體, 0 為正常  var titlebold=1// 說明  var copybold=1// 設(shè)置 'right', 'left' or 'center' 標(biāo)題對(duì)齊方式  var titlealign="right"http:// 說明  var copyalign="left"http:// 停頓時(shí)間  var standstill=4000var pre_titlebold  var after_titlebold  var pre_copybold  var after_copyboldvar cliptop=0  var clipbottom=0  var clipleft=0  var clipright=titlezonewidth+copyzonewidthvar i_message=0  var mes_joined  var mes_split  var contenttext  var contentbg=""var step=1  var pause=20if (titlebold==1) {  pre_titlebold="<b>"  after_titlebold="</b>"  }  else if (titlebold==0) {  pre_titlebold=""  after_titlebold=""  }if (copybold==1) {  pre_copybold="<b>"  after_copybold="</b>"  }  else if (copybold==0) {  pre_copybold=""  after_copybold=""  }function initiate() {  mes_joined=message[i_message]  mes_split=mes_joined.split("|")  contenttext="<table cellpadding=4 cellspacing=0 border=0>"  contenttext+="<tr valign='top'>"  contenttext+="<td align="+titlealign+" width="+titlezonewidth+" height='"+scrollerheight+"' bgcolor='"+titlezonebg+"'>"  contenttext+=""  contenttext+="<font face='"+font_titleface+"' color='"+font_titlecolor+"' size='"+font_titlesize+"'>"  contenttext+=pre_titlebold  contenttext+=mes_split[0]  contenttext+=after_titlebold  contenttext+="</font></td>"  contenttext+="<td align="+copyalign+" width="+copyzonewidth+" height='"+scrollerheight+"' bgcolor='"+copyzonebg+"'>"  contenttext+="<font face='"+font_copyface+"' color='"+font_copycolor+"' size='"+font_copysize+"'>"  contenttext+=pre_copybold  contenttext+=mes_split[1]  contenttext+=after_copybold  contenttext+="</font></td></tr>"  contenttext+="</table>"  var bg_width=titlezonewidth+copyzonewidth+2*scrollerborder  var bg_height=scrollerheight+2*scrollerborder  contentbg="<table width="+bg_width+" height='"+bg_height+"' cellpadding=0 cellspacing=0 border='"+scrollerborder+"'><tr><td bgcolor='"+scrollbg+"'> </td></tr></table>"  if (document.all) {  scrollertext.innerHTML=contenttext  scrollerbg.innerHTML=contentbg  document.all.scrollertext.style.posTop=scrollertop+scrollerheight  document.all.scrollertext.style.posLeft=scrollerleft  document.all.scrollerbg.style.posTop=scrollertop-scrollerborder  document.all.scrollerbg.style.posLeft=scrollerleft-scrollerborder  document.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"  scrollin()  }  if (document.layers) {  document.scrollertext.document.write(contenttext)  document.scrollertext.document.close()  document.scrollerbg.document.write(contentbg)  document.scrollerbg.document.close()  document.scrollertext.top=scrollertop+scrollerheight  document.scrollertext.left=scrollerleft  document.scrollerbg.top=scrollertop-scrollerborder  document.scrollerbg.left=scrollerleft-scrollerborder  document.scrollertext.clip.left=clipleft  document.scrollertext.clip.right=clipright  document.scrollertext.clip.top=cliptop  document.scrollertext.clip.bottom=clipbottom  scrollin()  }  }function scrollin(){  if (document.all){  if (document.all.scrollertext.style.posTop>scrollertop) {  clipbottom+=step  document.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"  document.all.scrollertext.style.posTop-=step  var timer=setTimeout("scrollin()",pause)  }  else {  clearTimeout(timer)  var timer=setTimeout("scrollout()",standstill)  }  }  if (document.layers){  if (document.scrollertext.top>scrollertop) {  clipbottom+=step  document.scrollertext.clip.left=clipleft  document.scrollertext.clip.right=clipright  document.scrollertext.clip.top=cliptop  document.scrollertext.clip.bottom=clipbottom  document.scrollertext.top-=step  var timer=setTimeout("scrollin()",pause)  }  else {  clearTimeout(timer)  var timer=setTimeout("scrollout()",standstill)  }  }  }function scrollout(){  if (document.all){  if (document.all.scrollertext.style.posTop>(scrollertop-scrollerheight)) {  cliptop+=step  document.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"  document.all.scrollertext.style.posTop-=step  var timer=setTimeout("scrollout()",pause)  }  else {  clearTimeout(timer)  changemessage()  }  }  if (document.layers){  if (document.scrollertext.top>(scrollertop-scrollerheight)) {  cliptop+=step  document.scrollertext.clip.left=clipleft  document.scrollertext.clip.right=clipright  document.scrollertext.clip.top=cliptop  document.scrollertext.clip.bottom=clipbottom  document.scrollertext.top-=step  var timer=setTimeout("scrollout()",pause)  }  else {  clearTimeout(timer) changemessage()  }  }  }function changemessage(){  i_message++  if (i_message>message.length-1) {i_message=0}  mes_joined=message[i_message]  mes_split=mes_joined.split("|")  cliptop=0  clipbottom=0  contenttext="<table cellpadding=4 cellspacing=0 border=0>"  contenttext+="<tr valign='top'>"  contenttext+="<td align="+titlealign+" width="+titlezonewidth+" height='"+scrollerheight+"' bgcolor='"+titlezonebg+"'>"  contenttext+=""  contenttext+="<font face='"+font_titleface+"' color='"+font_titlecolor+"' size='"+font_titlesize+"'>"  contenttext+=pre_titlebold  contenttext+=mes_split[0]  contenttext+=after_titlebold  contenttext+="</font></td>"  contenttext+="<td align="+copyalign+" width="+copyzonewidth+" height='"+scrollerheight+"' bgcolor='"+copyzonebg+"'>"  contenttext+="<font face='"+font_copyface+"' color='"+font_copycolor+"' size='"+font_copysize+"'>"  contenttext+=pre_copybold  contenttext+=mes_split[1]  contenttext+=after_copybold  contenttext+="</font></td></tr>"  contenttext+="</table>"  if (document.all) {  scrollertext.innerHTML=contenttext  document.all.scrollertext.style.posTop=scrollertop+scrollerheight  document.all.scrollertext.style.posLeft=scrollerleft  document.all.scrollertext.style.clip="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"  scrollin()  }  if (document.layers) {  document.scrollertext.document.write(contenttext)  document.scrollertext.document.close()  document.scrollertext.top=scrollertop+scrollerheight  document.scrollertext.left=scrollerleft  document.scrollertext.clip.left=clipleft  document.scrollertext.clip.right=clipright  document.scrollertext.clip.top=cliptop  document.scrollertext.clip.bottom=clipbottom  scrollin()  }  }</SCRIPT><div   class="iwvjtn8m0"   id="scrollerbg" style="POSITION: absolute; TOP: -1000px"></DIV><div   class="iwvjtn8m0"   id="scrollertext" style="POSITION: absolute; TOP: -1000px"></DIV></body></html>

上一篇：仿FLASH指定區(qū)域文字漂浮效果

下一篇：一段文字的展開/折疊效果