@virus7

Как сделать резиновый попап под iframe?

Есть форма в которой есть поля при выборе которых содержимое iframe удлиняется

как сделать так, что бы попап окно удлинялась с iframe
вот так не видит изменения в iframe и не удлиняет попап
$(function() {
    var iframe = $('#ourframe', parent.document.body);
    iframe.height($(document.body).height());
});


стр на которой это происходит

сейчас подрубил вот так :
$(document).ready(function() {

  // For IE
  var h = $('#ourframe').outerHeight();
  var newH = h + 20;
  window.resizeBy(0, newH - $(window).height());

  // Only works in Firefox/Safari
  $('img').load(function() {
    var h = $('#ourframe').outerHeight();
    var newH = h + 20;
    window.resizeBy(0, newH - $(window).height());
  });
});

но так он видит только максимально возможную высоту и сразу выводит её
  • Вопрос задан
  • 226 просмотров
Решения вопроса 2
sevirinov
@sevirinov
Web Developer
Вам поможет postMessage()
  1. в коде фрейма получаете размер окна (в вашем случае высоту) и передаете в сообщении postMessage() 'nb данные
  2. в окне-приемнике (там где выводите фрейм) получаете postmessage() сообщение и прописываете в style тег фрейма полученные данные о высоте
  3. чтобы окно было "адаптивным" нужно повесить обработчик resize в коде фрейма и в коде окна-приемника
Ответ написан
@virus7 Автор вопроса
подробное решение тут https://habr.com/post/140316/
актуальный скрипт https://github.com/daepark/postmessage
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы