Cómo lograr el efecto 3D de rotación de imagen en Java
input id="l" type="button" value="left" />
.lt;div class="item">2
& lt;div class="item">5
;
& lt;div class="item">8
& lt;div class="item">a
& lt;div class="item" >2
input id="l" type="button" value="left" />
.lt;div class="item">2
& lt;div class="item">5
;
& lt;div class="item">8
& lt;div class="item">a
& lt;div class="item" >2
var len;
var showerObj;
var listObj;
var showerWidth=800;
var showerHeight=400 ;
var r;
var cR=0;
var ccR=0;
var timer=0;
window.onload=function()onload=function(){
showerObj=document.getElementById("mostrar");
listObj= showerObj.getElementsByTagName("div ");
len=listObj.length;
r
=Math.PI/180*360/len;
for(var i=0;i
item.cos(r*i)*showerWidth/2-3"px";
item.rotate=(r*i+2*Math.PI)%(2*Math.PI);
item.onclick=function(){
cR=Math.PI/2-this.rotate;
temporizador || ,10));
}
}
var rX=showerObj.offsetLeft+showerWidth/2
var ry=showerObj .offsetTop+showerHeight/2;
var rotar=función(){
ccR=(ccR+2*Math.PI)%(2*Math.PI); p> p>
if(cR-ccR<0) cR=cR+2*Math.PI;
if(cR-ccR ccR= ccR+(cR-ccR)/19; }else{ ccR=ccR-(2*Math.PI+ccR-cR)/19; } p> if(Math.abs((ccR+2*Math.PI)%(2*Math.PI)-(ccR+2*Math.PI)%(2*Math.PI))< Matemáticas PI/720){ ccR=cR; clearInterval( temporizador); temporizador=0; } for(var i=0;i var item=listObj[i]; var w,h; var sinR=Math.sin(r*i+ ccR); var cosR=Math.cos(r*i+ccR); w=60.6 *60 *sinR; h=(40.6*40*sinR); item.style.cssText +=";ancho: "+w+"px ; alto: "+ h+"px;top:"+parseInt(showerHeight/2+sinR*showerWidth/2/3-w/2)+"px;left:"+parseInt(showerWidth/2+cosR*showerWidth/2-h/ 2) +"px;z-index:"+parseInt(showerHeight/2+sinR*showerWidth/2/3-w/2)+";"; } } document.getElementById("l").onclick= function(){ cR=(cR+r+2*Math.PI)%(2*Math.PI ); temporizador || (timer=setInterval(rotate,10)); } document.getElementById("r").onclick=función () { cR=(cR-r+2*Matemáticas.PI)%(2* Math.PI); temporizador || (timer=setInterval(rotate,10)); } rotar(); } } }.