rollpic_center.js
var rollwidth = 126; //每次滚动宽度 var speed=40; //滚动速度 var mymarL //往左滚动事件 var mymarR //往右滚动事件 var Lstopflag=1; var Rstopflag=1; scroll_front.innerHTML=scroll_begin.innerHTML scroll_end.innerHTML=scroll_begin.innerHTML function marqueeL(){ if (scroll_end.offsetWidth-scroll_div.scrollLeft<=0) scroll_div.scrollLeft-=scroll_begin.offsetWidth else{ if (scroll_div.scrollLeft%rollwidth==(rollwidth-2) && Lstopflag==1) { clearInterval(mymarL); } scroll_div.scrollLeft++; } } function marqueeR(){ if (scroll_div.scrollLeft<=0) scroll_div.scrollLeft+=scroll_begin.offsetWidth else{ if (scroll_div.scrollLeft%rollwidth==2 && Rstopflag==1) { clearInterval(mymarR); } scroll_div.scrollLeft--; } } goleft.onmouseover=function(){ clearInterval(mymarL); clearInterval(mymarR); Lstopflag=0; Rstopflag=1; mymarL=setInterval(marqueeL,speed); } /*goleft.onmouseout=function(){ Lstopflag=1; }*/ goright.onmouseover=function(){ clearInterval(mymarL); clearInterval(mymarR); Lstopflag=1; Rstopflag=0; mymarR=setInterval(marqueeR,speed); } /*goright.onmouseout=function(){ Rstopflag=1; }*/ scroll_div.onmouseover=function(){ clearInterval(mymarL); clearInterval(mymarR); if(Rstopflag==0) { Rstopflag=1; } else { Rstopflag=0; } if(Lstopflag==0) { Lstopflag=1; } else { Lstopflag=0; } } scroll_div.onmouseout=function(){ clearInterval(mymarL); clearInterval(mymarR); if(Lstopflag==1) { Lstopflag=0; mymarR=setInterval(marqueeL,speed); } else { Lstopflag=1; } if(Rstopflag==1) { Rstopflag=0; mymarR=setInterval(marqueeR,speed); } else { Rstopflag=1; } } clearInterval(mymarL); clearInterval(mymarR); Lstopflag=0; Rstopflag=1; mymarL=setInterval(marqueeL,speed);
设计
<tr> <td valign="middle" class="td02"> <table cellspacing="0" cellpadding="0" width="100%" align="center" border="0"> <tbody> <tr> <td width="15"> <div align="center"> <img id="goleft" src="../images/icon_01.gif" width="12" height="25" style="cursor: hand;"></div> </td> <td align="center" valign="top"> <div id="scroll_div" style="overflow: hidden; 680px; height: 130px" align="center"> <table height="129" cellspacing="0" cellpadding="0" width="100%" align="center" border="0"> <tbody> <tr> <td id="scroll_front"> </td> <td id="scroll_begin" valign="center" align="middle"> <table cellspacing="3" cellpadding="3" width="100%" align="center" border="0"> <tbody> <tr> $looptr sql="select top 10 c.contentid as va,p.filepath as vb,c.title,(cs.htmlfilepath+cs.htmlfilename)as vc from dbo.content c inner join contentsubject cs on c.contentid=cs.contentid inner join dbo.subject s on s.id=cs.subjectid and s.code='cmjjjc_xjzd_lzmh' inner join pubattach p on p.tableid=c.contentid and p.tablename='content' order by c.sequence asc,c.starttime desc,c.contentid desc"$ <td> <div align="center"> <table cellspacing="0" cellpadding="0" width="100" border="0"> <tbody> <tr> <td> </td> <td> <a href="$vc$" target="_blank" title="$title$"> <div class="bg_01"> <img alt="$title$" src="http://www.cnblogs.com/../..$vb$" height="111" border="0" /></div> </a> </td> <td> </td> </tr> </tbody> </table> </div> </td> </tr> </tbody> </table> </td> <td id="scroll_end"> </td> </tr> </tbody> </table> </div> </td> <td width="15"> <div align="center"> <img id="goright" src="../images/icon_02.gif" width="12" height="25" style="cursor: hand;"></div> </td> </tr> </tbody> </table> <script src="rollpic_center.js" type="text/javascript"></script> </td> </tr>