//在写css3的3d动画的时候 有时候会想不到3d效果，为了方便观察元素到底在页面的3d的那个位置，写了这个鼠标移动事件来旋转页面方便查看元素位置 var rox=0; var roy=0; var xn= 0,yn=0; var play=false;

$(document).mousedown(function(ev){
  clearInterval(play); var x_=ev.clientX; var y_=ev.clientY; $(this).bind("mousemove",function(ev){
  var x=ev.clientX; var y=ev.clientY; xn= x-x_; yn= y-y_; roy += xn*0.2; rox -= yn*0.1; //camera.position.z =400; camera.position.x =roy; camera.position.y =rox; camera.rotation.x =rox* Math.PI /180; camera.rotation.y =roy* Math.PI /180;

//这个是在页面加个红色小方块检测鼠标的位置

// $("body").append('
    
')

//这里就是要旋转的元素 这里写了body，也可以写div啊啥的盒子东西             $("body").css({
                  "transform-style": "preserve-3d",                 "transform":'perspective(800px) rotateX('+rox+'deg) rotateY('+roy+'deg)',                 "-webkit-transform":'perspective(800px) rotateX('+rox+'deg) rotateY('+roy+'deg)'             }); x_=ev.clientX;             y_=ev.clientY;         })     }).mouseup(function(){
  $(this).unbind("mousemove"); var play= setInterval(function(){
  xn*=0.95; //xn=xn*0.95 yn*=0.95; if(Math.abs(xn)<1&&Math.abs(yn)<1){
  clearInterval(play);             } roy += xn*0.2; rox -= yn*0.1; camera.position.x =roy; camera.position.y =rox; camera.rotation.x =rox* Math.PI /180; camera.rotation.y =roy* Math.PI /180;         },30)     })