7

次の HTML があります。

<div><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in 
reprehenderit in voluptate velit <strong id="s">esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</strong></p></div>

DIV の幅は、CSS を使用して 600px に固定されています。<strong>ここで、要素の offset().left を見つけたいと思います。だから私はした：

alert( $("#s").offset().left );

ただし、これは正しい値を生成していないようです。強い要素が 600px 幅の途中にあることがはっきりとわかりますが、得られるオフセット値はわずか 8px です。

インラインの強い要素の offset().left 値を見つけるにはどうすればよいですか?

4

3 に答える 3

26

何が起こっているかは次のとおりです。

ダイアグラム

インライン要素は複数の行にまたがるため、jQuery は要素の先頭のオフセットではなく、その要素の左端の位置を示します。

これを回避するには、次のプラグインを試してください。

jQuery.fn.inlineOffset = function() {
    var el = $('<i/>').css('display','inline').insertBefore(this[0]);
    var pos = el.offset();
    el.remove();
    return pos;
};

プラグインは一時要素を作成し、それをターゲット要素の直前に挿入します。その後、一時要素のオフセットを返します。

使用例:

alert( jQuery('strong').inlineOffset().left );
于 2009-06-15T12:41:10.640 に答える
0

8px の結果が得られる理由は、要素がコンテナーの途中で開始されても、改行があるため、その左端がページから 8px 離れているためです。

おそらくこれよりもはるかに優れた方法があるのではないかと感じていますが、この問題を回避するために最初に考えられるのは、 の直前に別の要素を挿入して<strong>その位置を確認することです。

$("<span><span>").insertBefore($('#s')).offset();
于 2009-06-15T12:42:16.393 に答える
-1

オフセットはドキュメントに対して相対的であり、位置は親に対して相対的であると思います。

http://docs.jquery.com/CSS/position

于 2009-06-15T12:36:59.277 に答える