Перекрестное изменение размера iframe без вертикальной полосы прокрутки

Question

У меня есть сайт, на котором я показываю информацию внутри iframe. И информация внутри iframe поступает из домена Salesforce. Данные, которые вы получаете, представлены в виде «учебного пособия» с несколькими страницами в нем.

Я добавил код javascript на обоих доменах для исправления изменения высоты, таким образом удалив вертикальную полосу прокрутки. Код в Salesforce странице:

function retrieveInfo(){ 
      parent.postMessage(document.body.scrollHeight, '*'); 
     } 

     function showLoading(){ 
      $('#dvLoading').show(); 
     } 

Код, написанный на моем сайте странице:

function resizeCrossDomainIframe(id, other_domain) { 
var iframe = document.getElementById(id); 
window.addEventListener('message', function(event) { 
    var height = parseInt(event.data); // add some extra height to avoid scrollbar 
    iframe.height = height + "px"; 
}, false); 

}

и мой IFrame в странице:

<iframe id="my_iframe" src="https://cp.secure.force.com/mydomainhome" width="100%" onload="resizeCrossDomainIframe('my_iframe', 'https://cp.secure.force.com/');" scrolling="yes"></iframe> 

Данные внутри iframe имеет левую панель и правую панель. Левая панель содержит список сбрасываемых меню, в котором отображается соответствующее содержимое курса. Левая панель manu расширяется при нажатии. Проблема, которую я получаю, заключается в том, что код javascript для удаления V-scroll вызывается при загрузке страницы, но как только страница загружается, и я нажимаю на левую панель, чтобы развернуть ее, v-scroll снова появляется ,

Это как страница отображается на странице загрузке:

Это как страница отображается после того, как я расширяю левое меню панели с внутренним скроллингом:

Есть ли способ Я могу предотвратить появление полосы прокрутки по вертикали даже после расширения меню левой панели. Однако я не хочу перезагружать страницу при нажатии на каждое из ссылок меню левой панели.

Answer 1

Запустил бы retrieveInfo на каждое событие window.resize решить проблему? Расширяя меню слева, вы в основном изменяете размер окна iframe. Если вы отправите сообщение, ваш iframe в родительском окне будет соответствующим образом изменен.

Я как-то решил эту проблему с внешней библиотекой, такой как iframe resizer (https://github.com/davidjbradshaw/iframe-resizer) Это может помочь вам в браузерах, не поддерживающих «postMessage».