1

画像をオーバーレイする右上隅と左下隅の 100 x 100 ピクセルのグラフィックがあります。これらはクロップ マークを表します。それぞれにバインドされたドラッグ イベントがあり、これらのクロップ マークをドラッグして画像のサイズを変更できます。それはすべて機能しますが、隅の画像をクリックしても、マウスはグラフィックの左上のすぐ左にジャンプします。グラフィックは 100 x 100 ピクセルなので、右下をクリックした可能性があります。マウス (または指) を、最初にクリック (またはタッチ) した場所にとどまり、左上から飛び出さないようにしたいと考えています。イベント (または this.offsetLeft、this.offsetTop) によって返されるさまざまなオフセットを見ると、ポインターが終了する場所から開始する場所までの x、y オフセットが得られないようです。

開始点を決定し、それをドラッグの接点に保つ方法はありますか?

右上隅/クロップのドラッグ ハンドラは次のとおりです。

function ur_crop()
{
    $('#ur_corner').bind('drag', function (event) {
    event.preventDefault();
    curX = event.pageX; 
    curY = event.pageY; 
    offsetX = curX - ur_curX;
    offsetY = curY - ur_curY;
    var $this = $(this);
    $(this).css({
        left: curX + 'px', 
        top: curY + 'px' 
    });

    ur_curX = curX; // + offsetX;
    ur_curY = curY; // + offsetY;

});

}

ありがとう！

4

1 に答える 1

0

マウスの位置を取得するためにコーナードラッグが選択された後、そこにjQueryのmousemoveイベントを結び付けます。

mousemove については、jQuery のドキュメントを参照してください。

于 2012-05-09T23:13:13.660 に答える