1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <title> New Document </title> 5 <meta name="Generator" content="EditPlus"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <style> 10 /*scroll图片滚动*/ 11 .scroll{ width:950px; height:190px; background:url(../images/title_03.gif) no-repeat left top;} 12 .s_t{ font-size:14px; font-weight:bold; line-height:35px; color:#303030; text-indent:15px;} 13 .demo{ width:948px; height:155px; border: 1px solid #d6e3ec; border-top:none;} 14 #demoa { background: #FFF; height:145px; overflow:hidden; width: 915px; margin-left:14px; padding-top:10px;} 15 #demoa ul{ margin-left:4px; float:left; text-align:center;} 16 #demoa ul li{ float:left; margin:0 5px;} 17 #demoa img { width:160px; height:125px; padding:5px; border: 1px solid #dddddd;} 18 #demoa img:hover{ cursor: default;} 19 #indemoa {float: left; width: 800%; } 20 #demo1a { float: left; } 21 #demo2a { float: left; } 22 23 </style> 24 </head> 25 26 <body> 27 <!--scroll--> 28 <div class="scroll"> 29 <div class="s_t">团队风采</div> 30 <div class="demo"> 31 <div id="demoa"> 32 <div id="indemoa"> 33 <div id="demo1a" style="height:146px; auto"> 34 <ul> 35 <li><a ><img src="<%=path %>/public/images/img_01.jpg" border="0" width="160px" height="120px" /></a></li> 36 <li><a ><img src="<%=path %>/public/images/img_01.jpg" border="0" width="160px" height="120px" /></a></li> 37 <li><a ><img src="<%=path %>/public/images/img_01.jpg" border="0" width="160px" height="120px" /></a></li> 38 <li><a ><img src="<%=path %>/public/images/img_01.jpg" border="0" width="160px" height="120px" /></a></li> 39 <li><a ><img src="<%=path %>/public/images/img_01.jpg" border="0" width="160px" height="120px" /></a></li> 40 </ul> 41 </div> 42 <div id="demo2a"></div> 43 </div> 44 </div> 45 </div> 46 <script> 47 <!-- 48 var speed=20; //数字越大速度越慢 49 var tab=document.getElementById("demoa"); 50 var tab1=document.getElementById("demo1a"); 51 var tab2=document.getElementById("demo2a"); 52 tab2.innerHTML=tab1.innerHTML; 53 function Marquee(){ 54 if(tab2.offsetWidth-tab.scrollLeft<=0) 55 tab.scrollLeft-=tab1.offsetWidth 56 else{ 57 tab.scrollLeft++; 58 } 59 } 60 var MyMar=setInterval(Marquee,speed); 61 tab.onmouseover=function() {clearInterval(MyMar)}; 62 tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)}; 63 --> 64 </script> 65 </div> 66 <!--end scroll--> 67 </body> 68 </html>