2

マウスダウン選択を使用できることはわかっていますが、クリックしたスプライトをマウスに追従させたいのですが、API で言及されている種類のマウストラッカー機能があります。残念ながら、マウスの検出が可能であると述べている以外に、これの例はありません。

//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
        });

    }
});

マウスの位置を選択しましたが、選択したスプライトをそれに追従させる方法がわかりません。

どんな助けでも大歓迎です。

4

2 に答える 2

3

マティが言ったことは正しいです: $.gQ.mouseTrackerを使用すると、イベント ハンドラーの外部でマウスの状態にアクセスできます。彼が提供する例は正しいですが、gQ オブジェクト (スプライト、タイルマップ、またはグループ) を移動するために使用することはできません。.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 に答える