2

I know I can use mousedown selection for it, but I am wanting the clicked on sprite to follow my mouse, there is a mousetracker function of sorts mentioned in the api; but unfortunately there are no examples of this other than stating that it allows mouse detection. 

//add mousedown events for yarnballs.
$(".gQ_sprite").mousedown(function() {
    clickedDivId = $(this).attr('id');
    if(clickedDivId.charAt(8) == "-")
    {
        currentClickedDivId = clickedDivId
        $(document).mousemove(function(e){
            spriteXPosition = e.pageX
            spriteYPosition = e.pageY
        });

    }
});

I have the location of the mouse selected, just not sure how to get the selected sprite to follow it.

any help would be greatly appreciated.

4

2 回答 2

3

Mati 说的是正确的：$.gQ.mouseTracker允许您在事件处理程序之外访问鼠标的状态。他给出的示例是正确的，但它不能用于移动 gQ 对象（sprite、tile-map 或组），因为您不允许对这些对象使用.css()函数。这样做会破坏碰撞检测。

如果你想要移动一个 gQ 对象，你应该这样做：

$('#' + currentClickedDivId).xy($.gQ.mouseTracker.x, $.gQ.mouseTracker.y);

但是由于这应该在周期性回调中完成，因此拖动的平滑度将取决于刷新率。

如果你想使用事件处理程序，你可以修改你的代码看起来像这样（不使用 mouseTracker）：

var clickedDiv;
var clickedDivOffset = {x:0, y:0};

$(".gQ_sprite").mousedown(function(e) {
    clickedDiv = $(this);
    clickedDivOffset = {
        x: e.pageX - clickedDiv.x() - $().playground().offset().left,
        y: e.pageY - clickedDiv.y() - $().playground().offset().top
    };
});

$(".gQ_sprite").mouseup(function() {
    clickedDiv = false;
});

$().playground().mousemove(function(e) {
    if(clickedDiv){
        clickedDiv.xy(
            e.pageX - clickedDivOffset.x,
            e.pageY - clickedDivOffset.y,
        );
    }
});

这将实现拖放效果。如果您希望被点击的元素粘在鼠标上，您将不得不稍微修改代码，但基本内容将保持不变。

于 2013-05-26T15:03:01.503 回答
2

According to the documentation:

If the mouse tracker is enabled you can check the state of the mouse at anytime by looking into the object $.gQ.mouseTracker where x and y contain the position of the mouse and 1, 2 and 3 a boolean value where true means that the first, second or thrid button is pressed.

Observe the output of:

$("#playground").playground({ refreshRate: 60, mouseTracker: true });

$.playground().startGame();
$.playground().registerCallback(function(){
    console.log( $.gQ.mouseTracker );
}, 1000);

To make those divs actually follow the cursor, you have to use .css()

$('#' + currentClickedDivId).css({
    top:  $.gQ.mouseTracker.y + 'px',
    left: $.gQ.mouseTracker.x + 'px'
});
于 2013-05-25T23:28:08.900 回答