Как динамически изменять размер iFrame со страницами разной высоты?

#javascript #jquery #iframe #onload

#javascript #jquery #iframe #загрузка

Вопрос:

Я использую этот код для динамического изменения размера iFrame в зависимости от содержимого удаленного сайта:

http://solidgone.org/Set-IFRAME-height-based-on-size-of-remotely-loaded-content

Однако на этом удаленном сайте есть и другие страницы. Что происходит, так это то, что когда я нажимаю на ссылку на удаленном сайте (внутри iFrame), высота соответственно не изменяется. Вместо этого он использует высоту страницы, которую мы изначально установили в iFrame. В этом случае используется высота remote.php (который довольно высокий):

 <iframe id='local-iframe' width='1' height='1' frameborder='0' scrolling='no' src ='http://remotesite.com/remote.php'></iframe>
</iframe>
  

Другое дело, что, даже если я указал scrolling = ‘no’ в iFrame, как только я нажал на ссылку внутри iFrame, полосы прокрутки снова появляются.

Есть ли какое-либо решение этой проблемы? Что мы делаем не так?

Ответ №1:

Код на этом сайте (ниже) сработал для меня, хотя я работаю над тем, чтобы граница исчезла…

http://ramanisandeep.wordpress.com/2009/12/16/how-to-dynamically-adjust-an-iframe ’s-height/


Вставить iframe на страницу

 <iframe scrolling='no' frameborder='0' id='frmid' src=’getad.aspx'
         onload='javascript:resizeIframe(this);'>
</iframe>
  

Используйте этот javascript для изменения размера iframe на основе высоты и ширины дочерней страницы

 <script language="javascript" type="text/javascript">
 function resizeIframe(obj)
 {
   obj.style.height = obj.contentWindow.document.body.scrollHeight   'px';
   obj.style.width = obj.contentWindow.document.body.scrollWidth   'px';
 }
 </script>
  

Ответ №2:

Я думаю, что в настоящее время вы не можете напрямую получить доступ к содержимому IFRAME любым возможным способом. Поэтому вы также не можете напрямую определить его высоту.

Как вы можете прочитать в статье, на которую вы ссылаетесь, автор написал обновление: http://solidgone.org/Redux-Set-IFRAME-height-based-on-size-of-remotely-loaded-content

Если я правильно понял, он отправляет запрос с высотой в качестве параметра на локальный ресурс, который поможет установить высоту.