First text up and down interval scroll correction version
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < HTML xmlns= "http://www.w3.org/1999/xhtml" > <pead> <title> compliant with Web Standard text interval scrolling JS code </title> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/> <style type=" Text/css "> <!--body,td,th {font-size:12px; Color: #333333; } a {font-size:12px; Color: #333333; } a:link {text-decoration:none; } a:visited {text-decoration:none; } a:hover {text-decoration:none; Color: #FF3300; } a:active {text-decoration:none; } body,div{margin:0 padding:0}--> </style></pead> <body> <script> var marqueecontent=n EW Array (); Rolling news marqueecontent[0]= ' <font color= ' #0000CC ' >14:25 </font>html/js Mutual conversion Tools-IE7 compatible version '; marqueecontent[1]= ' <font color= ' #0000CC ' >14:25 </font>css online compression tool '; marqueecontent[2]= ' <font color= "#0000CC" >14:25 </font>css reshaping and Optimization toolCompression '; marqueecontent[3]= ' <font color= ' "#0000CC" >14:25 </font>js JS compression '; var marqueeinterval=new Array (); Define some common and frequently used variable var marqueeid=0; var marqueedelay=2000; Update time, milliseconds var marqueeheight=18; Container Height//Next is to define some functions to use function Initmarquee () {var str=marqueecontent[0]; document.write (' <div id=marqueebox +marqueeheight+ ' px;line-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]); } initmarquee (); </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
There are some problems with the second Firefox run. But learning JS friends can see the main idea is to see.
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; charset=gb2312 "/> <title>js text-spaced scrolling code _ suitable for announcements </title> <meta name=" keywords "content=" text scrolling, interval scrolling, text over , JS code "/> <meta name=" description "content=" JS to achieve text-interval scrolling effect, suitable for announcements. "/> <style type=" Text/css "> <!--body{font-size:12px;} #shangfan {font-family: neo-Arial, XXFarEastFont-Arial, Imitation _gb2312;font-size:12px, line-height:24px height:24px width:400px; border:solid 1px #ccc; Overflow:hidden;} #shangfan ul{margin:0px 10px;padding:0px;list-style-type:none;} #shangfan ul li{/* text beyond the line, automatically omitted */overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0;padding:0px;} --> </style> </pead> <body> <div id= "Shangfan" > <div id= "Holder" > <ul> < JavaScript Online encryption tool for Li>packer_ Xeon </li> <li>xhtml Code nested View tool [tag closure]</li> <li> Cloud-dwelling community online conversion can realize all kinds of into the system </li> <li> online JS foot Test JS Error & lt;/li> <li> convert HTML to Php,javascript and ASP's online tools </li> </ul></div> </div> <script Type= "Text/javascript" > Function Marquee (height,speed,delay) {var scrollt; var pause = false; var scrollbox = document.getElementById ("Shangfan"); if (document.getElementById ("Holder"). offsetheight <= height) return; var _tmp = ScrollBox.innerHTML.replace (' Holder ', ' holder2 ') scrollbox.innerhtml + = _tmp; Scrollbox.onmouseover = function () {pause = true} Scrollbox.onmouseout = function () {pause = false} Scrollbox.scrolltop = 0; function Start () {scrollt = SetInterval (scrolling,speed); if (!pause) Scrollbox.scrolltop + + 2; The function scrolling () {if (scrollbox.scrolltop% height!= 0) {scrollbox.scrolltop = 2; if (scrollbox.scrolltop >= scrollbox.scrollheight/2) scrollbox.scrolltop = 0; } else{clearinterval (scrollt); SetTimeout (STart,delay); } settimeout (Start,delay); } marquee (24,30,3000); </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]