Extractnodes function solves the problem of node calculation in each browser. Firefox put the line break into a node, very unreasonable AH.
First use the AppendChild to copy the previous four nodes to the bottom, so that the head and tail is the same content for later use. Remember to do the flash tween cycle movement when it is the same as the tail.
Run the Rolltxt function by setinterval the interval.
The Rolltxt function first calculates is the interval pauses the height, the rolling how high must pause, this altitude I also did not know how to calculate out, has the relation with the CSS, I was tried out
The method of finding the remainder can be used to determine whether the interval height has been rolled over. If the remainder is not equal to 0, continue to add 1 scrolling. If the remainder is 0 indicating that the interval height has been scrolled, pause here.
Set a variable settime to calculate time, add to 50 when settime clear zero, rolling continue, this 50 I did not calculate what the unit is, anyway, I am happy.
This is not enough to stop scrolling, but there is a problem, no limit to the highest value, rolling keep rolling ah, of course, there will be something wrong. Get the hell out of here and start rolling again. Of course is rolled to the end of the same position, the page height minus the visible height is the right, why so? This oneself gestures the gestures to know.
Loop pause up and down scroll already done, don't believe you try
<! 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> cycle pause up and down </title> <style type=" Text/css "> #block2 {height:23px;width : 500px;border: #ccc 1px solid;font-size:12px;text-align:center;} #block2 ul{list-style:outside none none;height:17px;padding:3px 0;overflow:hidden;margin:0;} #block2 ul li{float:left;display:inline;margin:2px 0;height:14px;width:24.9%;} #block2 ul Li A{text-decoration:none;} </style> </pead> <body> <div id= "Block2" > <ul id= "rolltxt" > <li> cloud-Habitat Community 1</l i> <li> Cloud-Habitat community 2</li> <li> cloud-Habitat community 3</li> <li> cloud-Habitat community 4</li> <li> cloud-dwelling Community 5 </li> <li> Cloud-Habitat community 6</li> <li> cloud-Habitat 7</li> <li> cloud-Habitat Community 8</li> <li> cloud-Habitat community 9</li> <li> cloud-Habitat community 10</li> <li> cloud-Habitat community 11</li> <li> cloud-dwelling community 12< /li> <li> Cloud-Habitat community 13</li> <li> cloud-Habitat community 14</li> <li> cloud-Habitat community 15</li> <li> Cloud-dwelling Community 16</li> </ul> <script type= "Text/javascript" > Function extractnodes (pnode) {if (Pnode.node Type = = 3) return null; var node,nodes = new Array (); for (var i=0;node= pnode.childnodes[i];i++) {if (Node.nodetype = 1) nodes.push (node); return nodes; var Obj=document.getelementbyid ("Rolltxt"); for (i=0;i<4;i++) {obj.appendchild (extractnodes (obj) [I].clonenode (true)]; } settime=0; var t=setinterval (rolltxt,50); function Rolltxt () {if (obj.scrolltop% (obj.clientheight-5) ==0) {settime+=1; if (settime==50) {obj.scrolltop+=1; settime=0; }}else{obj.scrolltop+=1; if (obj.scrolltop== (obj.scrollheight-obj.clIentheight)) {obj.scrolltop=0; }} obj.onmouseover=function () {clearinterval ()} obj.onmouseout=function () {T=setinterval (rolltxt,50)} </SCRI pt> </div> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]