значение изменения размера окна, передаваемое в iframe - это значение до изменения размера - PullRequest
0 голосов
/ 16 апреля 2019

Из-за того, как настроены наши микросайты, у меня есть родительская страница, которая отображает дочернюю страницу через iframe. родительская страница является прославленной главной страницей верхнего и нижнего колонтитула, а дочерняя страница имеет фактическое содержимое (это вне моего контроля). К сожалению, высота дочерней страницы не является статичной. Это калькулятор с некоторыми элементами, которые появляются и исчезают. Я попытался сделать iframe родительской страницы максимально адаптивным, используя следующий код:

<!-- iFrame Resizer -->
<script>
    function resizeIframe(obj) {
      	obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    }
 
 	$(window).resize(function(){
  		var obj = document.getElementById("ifmContent");
  
  		resizeIframe(obj);
 	});
</script>
<!-- /iFrame Resizer -->
<div style="overflow: auto"> 
    <iframe src="index-iframe.html" frameborder="0" scrolling="no" onload="resizeIframe(this)" id="ifmContent"></iframe>
</div>

Но поскольку дочерняя страница адаптивна и отзывчива, я поместил этот фрагмент кода на дочернюю страницу:

var y = $("#divResults").innerHeight() + 200 + "px";                        
$(parent.document).find('#ifmContent').css("height",y);

Этот код срабатывает после нажатия кнопки «Вычислить» и отображения результата.

Это все отлично работает. Однако проблема, которую я предпочитаю, заключается в изменении размера браузера. Функция изменения размера срабатывает, но по какой-то причине значение высоты, которое я получаю с дочерней страницы, является значением до изменения размера.

Например, я добавил оповещения на обеих страницах, чтобы видеть, какие значения высоты я получаю.

Для родительской стороны у меня есть это:

<!-- iFrame Resizer -->
<script>
    function resizeIframe(obj) {
        alert(obj.contentWindow.document.body.scrollHeight);
        obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    }

    $(window).resize(function(){
        var obj = document.getElementById("ifmContent");

        resizeIframe(obj);
    });
</script>
<!-- /iFrame Resizer -->

И на дочерней странице я добавил это:

$(window).resize(function(){
    var x = $(document).height();
    alert(x);
});

Итак, при загрузке и когда я выполняю обычные функции, все работает хорошо. Но когда я минимизирую окно, я получаю значение высоты документа до изменения размера:

enter image description here

И затем содержимое обрезается, потому что размер iframe слишком мал:

enter image description here

Затем, когда я максимизирую его, я получаю высоту от того, когда браузер был свернут:

enter image description here

Можно ли получить значения высоты после изменения размера браузера?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...