<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang=it dir=ltr xml:lang="it" xmlns="http://www.w3.org/1999/xhtml"> <head> <title>css+js§c6RþVGrU\:y</title> <style> body{ padding: 0px; margin: 0px; font: 70% verdana, geneva, arial, helvetica, sans-serif; color: #000; text-align: center } #outer{ padding: 0px; margin: 0px; width: 800px; text-align: center } #focus{ border: #ccc 2px solid; margin: 0px; padding: 0px; padding-top: 15px; background: url(http://www.soojs.com/t/images/tile.gif) #eee repeat-y left top; width:694px; position: relative; height: 180px } #description{ width:594px;/*=188*3+15*2 */ height:150px; overflow:hidden; margin-right:15px; float:left; } .dis{ float:left; width:40px; text-align: center; padding-top:50px } #description ul, #description li { float:left; display: inline; margin: 0; padding: 0; height:150px } .content a:active, .content a:visited, .content a:link { display: inline; margin: 0; padding: 0; padding-left: 5; padding-right: 5; text-decoration: none; } .content a:hover { color: #ffffff; display: inline; text-decoration: none; } img {border:0px} </STYLE> </head> <body> <div id=outer> <div id=focus> <div class="dis"> <img id="img_l" src="http://cozwoo.132.tofor.com/temp/btn_left.jpg" alt="Tæ]Ún¨R" onClick="doSlide(-1)" /> </div> <div id=description> <div id="content0" style="border:0px solid red;height:150px;width:2376px"><!--(#description.width=594px)*4--> <ul id="content" class=content> <li><a href="#"><img src="http://www.webjx.com/img/200406302.jpg"/></a></li><li><a href="#"> <img src="http://www.lngc.net.cn/imagejj/index2.jpg"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li><li><a href="#"> <img src="http://cozwoo.132.tofor.com/temp/rounded.gif"/></a></li></ul></div> </div> <div class="dis"> <img id="img_r" src="http://cozwoo.132.tofor.com/temp/btn_right.gif" alt="TóSÚn¨R" onClick="doSlide(1)" /> </div> </div> </div> <script> var ok_obj=document.getElementById("content").getElementsByTagName("LI") var ok=Math.ceil(ok_obj.length/3)-1 var ele=document.getElementById("description"); var w=ele.clientWidth; var n=20,t=50; var timers=new Array(n); var k=0;doSlide(0); function doSlide(s){ if (k>=ok &&s>0|| k<=0 &&s<0)alert("±bIk,ò]Ï~0R4Y†N!") else{ k+=s; var x=ele.scrollLeft; var d=k*w-x; for(var i=0;i<n;i++)( function(){ if(timers[i]) clearTimeout(timers[i]); var j=i; // alert(x) timers[i]=setTimeout(function(){ele.scrollLeft=x+Math.round(d*Math.sin(Math.PI*(j+1)/(2*n)));},(i+1)*t); } )(); }} </script> </body> </html>