Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   высота iframe по содержимому (https://javascript.ru/forum/dom-window/83350-vysota-iframe-po-soderzhimomu.html)

PAMAC 20.11.2021 20:55

высота iframe по содержимому
 
Добрый день!

Пытаюсь динамически изменить высоту iframe (подгружается с моего же сайта), ничего не выходит. Как только не пытаюсь получить высоту содержимого - постоянно возвращает 0. Прошу помочь с решением!

Содержимое основной страницы:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title>1</title>
</head>
<body>
	<iframe src="1.php" id="frame" frameborder="1" onload="resizeIframe(this)"></iframe>
</body>
<script>
  function resizeIframe(obj) {
	//alert(obj.contentWindow.document.getElementsByTagName('body')[0].scrollHeight); - тоже возвращает 0
    obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px'; // возвращает 0
  }
</script>
</html>


Содержимое фрейма:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title>1</title>
</head>
<body onclick="alert(this.offsetHeight); // а тут возврщает высоту (при нажатии на body)">
	<div style="background:red; width:100px; height:350px;"></div>
</body>
<script>
//window.onload = function() {
	//alert(document.getElementsByTagName('body')[0].offsetHeight); - тоже возвращает 0
	//alert(document.documentElement.scrollHeight); - тоже возвращает 0
//}
</script>
</html>

voraa 20.11.2021 23:03

Не понятно, что у вас происходит
Вот такой код
fm.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title>1</title>
</head>
<body>
    <iframe src="fr.html" id="frame" frameborder="1" onload="resizeIframe(this)"></iframe>
</body>
<script>
  function resizeIframe(obj) {
    console.log('main ', obj.contentWindow.document.getElementsByTagName('body')[0].scrollHeight);
    obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
  }
</script>
</html>


fr.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title>1</title>
</head>
<body onclick="alert('fffbc '+this.offsetHeight);">
    <div style="background:red; width:100px; height:350px;"></div>
</body>
<script>
window.onload = function() {
    console.log('frame ', document.getElementsByTagName('body')[0].offsetHeight);
    console.log('frame ', document.documentElement.scrollHeight);
}
</script>
</html>


Отрабатывает совершенно нормально
Выдает

frame 350
frame 366
main 350

И фрейм получает размер по содержимому
Может, что с php не так?
Ошибок в консоле никаких нет?
Они оба на одном сервере?

MallSerg 21.11.2021 11:39

Нарушение политики одного источника.


Часовой пояс GMT +3, время: 12:30.