offset(coordinates)


version 1.4 以降

解説

マッチした最初の要素の、ドキュメントの左上からの相対位置を設定します。

引数

  • coordinates
    Object:position: relative に対する、top(上からの位置) と left(左からの位置)をプロパティに持つオブジェクト。

    もしくは、top(上からの位置)、left(左からの位置)、using プロパティにコールバック関数を設定したオブジェクト。
    このコールバック関数には、offset の計算結果が渡されます。
    usingプロパティにコールバック関数を設定したオブジェクトを返した場合は、現在の offset 値は変更されません。
    もし、変更したい場合は、using 関数の中で処理します。
    obj.offset({
        top:  10,    // offset の計算に使用され、適用されない
        left: 10,    // offset の計算に使用され、適用されない
        using: function(calcOffset) {
            // offset の計算結果(position: relative に対する位置)
            calcOffset;
    
            // 適用する場合
            $(this).css(calcOffset);
        }
    });
    

戻り値

  • jQuery: jQueryオブジェクト

関連


例1:移動ボタンをクリックすると、10 ピクセルづつ移動します。
10回毎に方向が変わります。

var count = 0;
var direction = 1;

$("#run").click(function() {
    direction = count == 10 ? -1 : count == 0 ? 1 : direction;
    count = count + direction;

    var os = $(".box").offset();
    $(".box").offset({
        top:  os.top   + direction*10,
        left: os.left  + direction*10
    });
});