jq 鼠标旋转控制也能3d旋转

//在写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(‘<div style="width:5px;height:5px;position:absolute;top:‘+y+‘px;left:‘+x+‘px;background:red;"></div>‘)

//这里就是要旋转的元素 这里写了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.95yn*=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)

    })