Свяжите положение двух div внутри и снаружи iframe

Question

Свяжите положение двух div внутри и снаружи iframe

0

У меня есть iframe и много divs в нем. Теперь я хочу создать поле для подсказки, которое связано с определенным div внутри iframe, то есть находится на одной высоте и перемещается с div iframe при прокрутке в iframe. Есть ли способ достичь этого?

Обратите внимание, что я не могу переместить подсказку в iframe, потому что контент генерируется в общем виде, и нет места для подсказок.

Концепт:

_______________________
|  ___________________ |  ____________ 
| |                   || |  hint div  |
| |      div          || |____________|
| |___________________||
|                      |
|        iframe        |
|                      |
|______________________|

благодаря

Sceptical Jule 30 дек. 2013, в 17:43

Источник

2

Может показаться, что разрешение на такую вещь будет представлять угрозу безопасности ... если контенту фрейма не разрешено связываться с содержащим фреймом / окном
PinnyM 30 дек. 2013, в 16:41
2

Содержимое iframe и страница, на которой закодирован iframe, происходят из одного домена?
Josh Beam 30 дек. 2013, в 16:43
0

Да, обе страницы находятся в одном домене. @PinnyM Я подумал, что, возможно, родительское окно может как-то следовать позиции прокрутки без необходимости взаимодействия с iframe.
Sceptical Jule 30 дек. 2013, в 16:49
1

Нет, iframe не должен знать этого. Однако, если вы используете один и тот же домен, зачем использовать iframe? В конце концов, похоже, что у вас включен JS и вы можете использовать AJAX для загрузки этого контента в div.
PinnyM 30 дек. 2013, в 16:53
0

как упоминалось почему? iFrame, если они находятся в одном домене, почему бы не использовать ajax / jquery и т. д. для загрузки содержимого в указанный div таким образом, чтобы у вас был полный контроль над dom всех
Simon Davies 30 дек. 2013, в 16:56
0

Я не знаком с AJAX. Я пытался загрузить содержимое, используя $(document).ready(function () { $("#viewer").load(url); }); но это не сработало.
Sceptical Jule 30 дек. 2013, в 17:00
0

убедитесь, что #viewer ссылается на div, а не на iframe. (как бы победить цель ..)
TastySpaceApple 30 дек. 2013, в 17:13
0

Оберните #hint_div ( position: absolute ) и iframe внутри #wrapper div ( position: relative ). Затем в iframe добавьте слушатель события onscroll для window , и в этой функции-обработчике прочитайте значение #div getBoundingClientRect().top и установите значение # #hint_div 's style.top .
Teemu 30 дек. 2013, в 17:19

Показать ещё 6 комментариев

Теги:

javascript

html

css

scroll

1 ответ

Ещё вопросы

Может показаться, что разрешение на такую вещь будет представлять угрозу безопасности ... если контенту фрейма не разрешено связываться с содержащим фреймом / окном
Содержимое iframe и страница, на которой закодирован iframe, происходят из одного домена?
Да, обе страницы находятся в одном домене. @PinnyM Я подумал, что, возможно, родительское окно может как-то следовать позиции прокрутки без необходимости взаимодействия с iframe.
Нет, iframe не должен знать этого. Однако, если вы используете один и тот же домен, зачем использовать iframe? В конце концов, похоже, что у вас включен JS и вы можете использовать AJAX для загрузки этого контента в div.
как упоминалось почему? iFrame, если они находятся в одном домене, почему бы не использовать ajax / jquery и т. д. для загрузки содержимого в указанный div таким образом, чтобы у вас был полный контроль над dom всех
Я не знаком с AJAX. Я пытался загрузить содержимое, используя $(document).ready(function () { $("#viewer").load(url); }); но это не сработало.
убедитесь, что #viewer ссылается на div, а не на iframe. (как бы победить цель ..)
Оберните #hint_div ( position: absolute ) и iframe внутри #wrapper div ( position: relative ). Затем в iframe добавьте слушатель события onscroll для window , и в этой функции-обработчике прочитайте значение #div getBoundingClientRect().top и установите значение # #hint_div 's style.top .

TastySpaceApple · Answer 1 · 2013-12-30T15-44-00.000Z

Вы можете получить доступ к содержимому окна iframe с помощью iframe.contentWindow

http://www.w3schools.com/jsref/prop_frame_contentwindow.asp

Затем вам нужно будет выполнить некоторые вычисления на основе прокрутки (iframe.contentWindow.documentElement.scrollTop || iframe.contentWindow.body.scrollTop)

и позиция div (iframe.contentWindow.getElementById("divID").offsetTop)

Обратите внимание, что это доступно только для междоменного.

И в целом - AJAX более рекомендуется, чем iframes. см. http://rev.iew.me/help-moving-from-iframes