Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var scrollDelay = 10; // The greater the number, the slower the speed.
Var Scroll = document. getElementById ("scroll ");
Var Scroll2 = document. getElementById ("scroll2 ");
Var currentTop = 0, preTop = 0, stoptime = 0, stopscroll = false;
Var ScrollChild = Scroll. getElementsByTagName ("li ");
Var ScrollHeight = Scroll. offsetHeight;
Function ScrollInfo (){
If (stopscroll = true) return;
CurrentTop ++;
If (currentTop + 1> = ScrollHeight ){
CurrentTop --;
Stoptime ++;
If (stoptime = parseInt (ScrollHeight) * scrollDelay ){
CurrentTop = 0;
Stoptime = 0;
}
} Else {
PreTop = Scroll. scrollTop;
Scroll. scrollTop ++;
If (preTop = Scroll. scrollTop ){
Scroll. scrollTop = Scroll2.offsetHeight-ScrollHeight;
Scroll. scrollTop + = 1;
}
}
}
Function Int_Scroll (){
Scroll2.innerHTML = "";
Scroll2.innerHTML = Scroll. innerHTML;
Scroll. innerHTML = Scroll2.innerHTML + Scroll2.innerHTML;
Scroll. onmouseover = function (){
Stopscroll = true;
}
Scroll. onmouseout = function (){
Stopscroll = false;
}
SetInterval ("ScrollInfo ()", scrollDelay );
}
Window. setTimeout ("Int_Scroll ()", 1000 );
</Script>
<! 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> <title> Untitled </title> <style type = "text/css">. kefuchu {width: pixel PX ;}. SS_dh1 {background: url (.. /images/SSindex/SS_dh1.jpg) no-repeat; height: 51px; width: 84px; float: left }. SS_dh2 {background: url (.. /images/SSindex/SS_dh2.jpg) no-repeat; height: 51px; width: 25px; float: left; display: block }. SS_dh3 {background: url (.. /images/SSindex/SS_dh3.jpg) repeat-y; width: pixel ;}. SS_dh4 {background: url (.. /images/SSindex/SS_dh4.jpg) no-repeat; height: 17px; width: pixel PX ;}. SS_dh5 {background: url (.. /images/SSindex/SS_dh5.jpg) no-repeat; height: 23px; width: 74px; margin-left: 20px ;}# scroll li {float: left; width: 150px ;} # scroll2 {display: none ;}</style> </pead> <body> <ul style = "width: 500px; height: 20px; overflow: hidden; border: 1px red solid; line-height: 20px; "id =" scroll "> <li> script home </li> <li> jb51.net </li> <li> Read </li> <li> kanshule.com </li> <li> good study </li> <li> </li> <li> 10 </li> <li> 11 </li> <li> 12 </li> li> 13 </li> <li> 14 </li> <li> 15 </li> <li> 16 </li> <li> a significant increase of 17 </li> <li> a significant increase of 18 </li> <li> a significant increase of 19 </li> <li> a significant increase of 20 </li> </ul> <ul id = "scroll2"> </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]