Найти конкретный текст в DIV в соответствии со смещением в пикселях - PullRequest
2 голосов
/ 12 ноября 2009

Я хочу вставить тег изображения в блок текста так, чтобы изображение было, скажем, на 100 пикселей ниже в DIV.

    <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>

Итак, вышеприведенный тег помещается в текстовый блок, который должен быть перемещен так, чтобы он располагался на 100px DOWN в DIV. Теперь это не может быть сделано статически, это должно быть сделано в javascript, так как 100px вниз в div может быть представлен различным текстом в зависимости от проблем рендеринга шрифта и тому подобного.

Итак, есть ли способ найти какое «слово» в текстовом блоке, который на 100px ниже в DIV? jQuery что ли?

1 Ответ

2 голосов
/ 12 ноября 2009

Краткий ответ: нет

По сути, все сводится к тому, что DOM не дает вам возможности получить положение элементов в пикселях. Для некоторых браузеров вы можете сделать что-то вроде хаков, но удачи в том, что решение работает.

Если вы не можете получить позицию содержащего элемента div, вы не получите позицию для текста внутри.

Оставляя в стороне no , если бы вы нашли способ получить высоту пикселя div, я бы следовал процедуре, аналогичной следующей.

  1. Получите текст из div и сохраните его в локальной переменной.
    1. Внутри цикла для каждого слова в тексте:
    2. Вставьте тег div непосредственно перед словом.
    3. Получить позицию пикселя тега div.
    4. Используйте это для определения ближайшего слова к пикселю pos 100 вниз.
  2. Как только у вас появится ближайшая позиция, создайте фрагмент документа, чтобы создать новый внутренний элемент для div
  3. Заменить содержимое div на фрагмент документа.
...