2

イメージ タグをテキスト ブロックに挿入して、イメージが DIV 内でたとえば 100 ピクセル下になるようにしたいと考えています。

    <div>
    A lot of text in a text block and a <img tag> somewhere
that is floated left or right and positioned inside the text block
    </div>

というわけで、上記のタグをフロートするテキストブロックに入れ、DIV の 100px DOWN に配置します。現在、これは静的に行うことはできません。div の 100 ピクセル下は、フォントのレンダリングの問題などによって異なるテキストで表される可能性があるため、javascript で行う必要があります。

では、DIV で 100px 下にあるテキスト ブロック内の「単語」を見つける方法はありますか? おそらくjQuery？

4

1 に答える 1

2

短い答えはノーです

基本的には、DOM が要素のピクセル位置を取得する方法を提供しないことに帰着します。一部のブラウザで実行できる一種のハックがありますが、解決策が機能するように頑張ってください.

含まれている div の位置を取得できない場合、その中のテキストの位置を取得することはできません。

noは別として、div のピクセルの高さを取得する方法を見つけるとしたら、次のような手順に従います。

  1. div 内からテキストを取得し、ローカル変数に保存します。
    1. テキスト内の各単語のループ内:
    2. 単語の直前に div タグを挿入します。
    3. div タグのピクセル位置を取得します。
    4. これを使用して、ピクセル pos 100 down に最も近い単語を決定します。
  2. 最も近い位置を取得したら、ドキュメント フラグメントを作成して、div の新しい内部を構築します。
  3. div のコンテンツをドキュメント フラグメントに置き換えます。
于 2009-11-12T09:30:07.543 に答える