Windy's Blog无缝跑马灯，兼容ie和firefox
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
<div id="marq" style="overflow:hidden;width:676px; margin:4px 4px;"> <table cellpadding="0" cellspacing="0" border="0"> <tr> <td id="marq1" valign="top" align="center"><table cellpadding="2" cellspacing="0" border="0"> <tr align="center"> <td class="i_pro1"><a href="#"><img src="images/pic_vip.jpg" width="81" height="71" class="img_2"onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_oa.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_szft.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_szxy.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_lqjc.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_net.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> <td class="i_pro1"><a href="#"><img src="images/pic_soa.jpg" width="81" height="71" class="img_2" onmouseover="this.style.backgroundColor='#949494'" onmouseout="this.style.backgroundColor='#FFFFFF'" /></a></td> </tr> <tr align="center"> <td>VIP可视化智能门户</td> <td>OA办公自动化</td> <td>数字法庭</td> <td>数字校园</td> <td>粮情监测系统</td> <td>网络系统</td> <td>SOA</td> </tr> </table></td> <td id="marq2" valign="top"></td> </tr> </table> </div> <script> var marq = document.getElementById("marq"); var marq1 = document.getElementById("marq1"); var marq2 = document.getElementById("marq2"); var speed=30//速度数值越大速度越慢 marq2.innerHTML=marq1.innerHTML function Marquee(){ if(marq2.offsetWidth-marq.scrollLeft<=0) marq.scrollLeft-=marq1.offsetWidth else{ marq.scrollLeft++ } } var MyMar=setInterval(Marquee,speed) marq.onmouseover=function() {clearInterval(MyMar)} marq.onmouseout=function() {MyMar=setInterval(Marquee,speed)} </script> </div> |
未经允许不得转载：Windy's Blog » 无缝跑马灯，兼容ie和firefox
