如何通过鼠标在javascript中控制对象的方向?

时间:2012-10-09 10:24:29

标签: javascript html5

我正在开发一个html5游戏项目。在这里我必须通过鼠标控制我的对象方向。我已经从键盘控制它了。但我想实现鼠标控制。所以任何人都可以帮助然后回复我。

3 个答案:

答案 0 :(得分:2)

假设你正在使用jQuery:

$(document).bind('mousemove', function(e) {
    var refObj = $('#image-id');  // reference object selector
    var objPos = refObj.offset(); // get object's absolute position
    var objCenterPos = {          // get object's center absolute position
        x: objPos.left + refObj.width()  / 2,
        y: opjPos.top  + refObj.height() / 2
    };
    var refPos = { // compute mouse position relative to reference object
        x: e.pageX - objCenterPos.x,
        y: e.pageY - objCenterPos.y
    };

    updateDirectionVector(refPos); // refPos is also the direction vector
});

function updateDirectionVector(vector) {
    // do whatever you want here
}

答案 1 :(得分:0)

使用'onmousemove'并捕获其事件

window.onmousemove = functionName;

functionName(event){
    //now read the relevant event properties for the mouse
    //console.log(event); //use console.log to get a list of possible event properties
    x = event.pageX;
    y = event.pageY;

}

您需要跟踪以前的位置并在该功能中执行许多其他操作,但有很多文档可以帮助您入门。

试试这个链接: http://orangesplotch.com/mouse_follower-javascript_tutorial/

答案 2 :(得分:0)

以下代码可能会给你一些想法!

var refPos = {x:window.event.clientX,y:window.event.clientY};

window.addEventListener("mousemove",function(){
var curPos = {x:window.event.clientX,y:window.event.clientY};
var left = refPos.x - curPos.x;
var top = refPos.y - curPos.y;
var direction = "";
direction += (top < 0)?"South":"North";
direction += (left <0)?"East":"West";
alert("Relative Direction " + direction);
},true);

希望这有一些帮助!

相关问题