我需要用Jquery-rotate旋转箭头,但我不知道光标的角度:( 我尝试计算它,但脚本不起作用。
我想要这样的结果http://www.lonhosford.com/content/html5/canvas/rotate_to_mouse.html
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
function diff(x, y) {
var a = (x * Math.PI / 180) - Math.PI;
var b = (y * Math.PI / 180) - Math.PI;
return Math.atan2(Math.sin(b - a), Math.cos(b - a)) * (180 / Math.PI);
}
$('body').mousemove(function(e){
var x = e.pageX;
var y = e.pageY;
var myAngle = diff(x, y);
$("#image").rotate(myAngle);
});
});
//]]>
</script>
答案 0 :(得分:1)
如果你查看你发布的例子的源代码,你会发现
update: function()
{
// Distance from mouse x and center of canvas.
this._dx = mouse.x - this.centerX;
// Distance from mouse y and center of canvas.
this._dy = mouse.y - this.centerY;
// Radians for the canvas rotate method.
this._radians = Math.atan2(this._dy,this._dx);
}
要根据自己的需要调整此代码,请尝试
function diff(x, y) {
var centerItem = $('imageid'),
centerLoc = centeItem.offset();
var dx = x - centerLoc.left + (centerItem.width() / 2);
dy = y - centerLoc.top + (centerItem.height() / 2);
return Math.atan2(dy, dx) * (180 / Math.PI);
}