Copy code code as follows:
<script>
var speed=20;/* the higher the speed, the slower the speed/
document.getElementById (' Www_qpsh_com2 '). Innerhtml=document.getelementbyid (' www_qpsh_com1 '). InnerHTML; The
/* Two layers alternate back and forth/
function Marquee () {
If document.getElementById (' Www_qpsh_com2 '). Offsetwidth-document.getelementbyid (' www_qpsh_com '). scrollleft<=0)
document.getElementById (' Www_qpsh_ com '). Scrollleft-=document.getelementbyid (' www_qpsh_com1 '). offsetwidth;
else{
document.getElementById (' www_qpsh_com '). scrollleft++;
}
document.getElementById (' My_marquee_info '). Innerhtml= ';
document.getElementById (' My_marquee_info '). innerhtml+= ' Div.scrolltop: ' +document.getelementbyid (' Www_qpsh_ com '). scrollleft;
}
Var mymar=setinterval (marquee,speed);
Www_qpsh_com.onmouseover=function () {clearinterval (MyMar);}
Www_qpsh_com.onmouseout=function () {mymar=setinterval (marquee,speed);}
</script>
Demo Code:
<! 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>my Marquee halign</title> ;/head> <style>/*my Marquee CSS start*/my_marquee_info{width:200px;border: #987654 solid 1px;padding:20px 3p x 3px 2px;margin-top:30px;} . My_marquee_main{width:200px;height:160px;border: #234567 solid 1px;padding:2px 3px 3px 2px;overflow:hidden;} . My_marquee_div1{width:195px;border:green solid 1px; . my_marquee_div2{width:195px;border:red solid 1px; /*my Marquee CSS end*/</style> <body > <div id= "www_qpsh_com" > <table align= "left" cellpadding= "0" cellspace= "0" border= "0" > <tr> <td id= "www_qpsh_com1" valign= "Top" > <table border= "0" cellpadding = "0" cellspacing= "> <tr> <td height=" align= "center" valign= "middle" title= "I am the first" > <center > Training Venues </center> </td> <td height= "align=" "Center" valign= "Middle" > <center> Leisure Tea Bar </center> </td& Gt <TD height= "align=" "Center" valign= "Middle" > <center> Club Profile </center> </td> <td height= "Align=" "Center" valign= "Middle" > <center> indoor Arena and Stables </center> </td> <td height= "align=" "Center" valign= "middle" title= "I'm the last one" > <center> Pastoral Course </center> </td> </tr> </table& Gt </td> <td id= "www_qpsh_com2" valign= "Top" > </td> </tr> </table> </div> <div C lass= "My_marquee_info" id= "My_marquee_info" ></div> <script> var speed=20;/* the higher the speed, the slower the number. document.getElementById (' Www_qpsh_com2 '). Innerhtml=document.getelementbyid (' www_qpsh_com1 '). InnerHTML; function Marquee () {if document.getElementById (' Www_qpsh_com2 '). Offsetwidth-document.getelementbyid (' Www_qpsh_ com '). scrollleft<=0) document.getElementById (' Www_qpsh_com '). Scrollleft-=document.getelementbyid (' www_qpsh_com1 '). offsetwidth; else{document.getElementById (' www_qpsh_com '). scrollleft++; } document.getElementById (' My_marquee_info '). Innerhtml= '; document.getElementById (' My_marquee_info '). innerhtml+= ' Div.scrolltop: ' +document.getelementbyid (' www_qpsh_com ') . scrollleft; } var mymar=setinterval (marquee,speed); Www_qpsh_com.onmouseover=function () {clearinterval (MyMar);} Www_qpsh_com.onmouseout=function () {mymar=setinterval (marquee,speed);} </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
