Получить идентификатор элемента в окне просмотра

У меня есть iframe, добавленный внутри тега div. Содержание Iframe имеет тег «сек» с конкретным идентификатором, как,Получить идентификатор элемента в окне просмотра

<p> 
<sec id='1'>some text</sec> 
<sec id='2'>some other text</sec> 
</p>

содержания Iframe спредов по горизонтали, используя ширину столбца и разрыв столбца. Div прокручивается в соответствии с шириной iframes.

Что мне нужно найти, это первое и последнее значение id тега 'sec', которое видно сейчас в viewport.

Я нашел о getBoundingClientRect, но не понял, как его можно использовать?

Кроме того, проблема заключается в том, что это не увеличит нагрузку на обработку, так как нам нужно запустить цикл для проверки каждой позиции тега?

Может ли кто-нибудь затенять свет?

источник

2017-02-10 pravid

'getBoundingClientRect' является относительно видового экрана/окна элементы содержатся в, т.е. она возвращает положение внутри iframe. Вам нужно знать, видны ли элементы внутри iframe? Или вам нужно знать, видны ли они внутри iframe _and_, если iframe отображается внутри главного окна? – hashchange

Если производительность имеет значение или с помощью jQuery работает для вас, вам может потребоваться просмотреть [jQuery.isInView] (https://github.com/hashchange/jquery.isinview), компонент, который я написал, что делает работу (и делает это очень быстро) и работает для iframes. – hashchange

Мне нужно найти все идентификаторы div или тегов, которые видны внутри этого окна просмотра. Можно ли получить первый и последний элемент в видимой области с помощью вашего плагина? – pravid

Вот как вы можете получить идентификатор первого и последнего видимого элемента внутри фрейма, используя jQuery.isInView:

var $iframe = $(yourIframeSelector), 
    _document = $iframe[0].contentDocument, 

    $elements = $(yourElementSelector, _document), 
    $visible = $elements.inView(_document), 

    firstId = $visible.first().attr("id"), 
    lastId = $visible.last().attr("id");

источник

2017-02-10 11:33:05 hashchange

Мне пришлось сделать несколько изменений, но он отлично работает, спасибо! Принятие в качестве ответа. – pravid

Получить идентификатор элемента в окне просмотра

ответ

Смежные вопросы