Вызов родительской функции изнутри iFrame для изменения высоты элемента - PullRequest
Новая
       10

Вызов родительской функции изнутри iFrame для изменения высоты элемента

0 голосов
/ 18 февраля 2012

Я создаю свой первый веб-сайт, и у меня есть основной элемент, который должен растягиваться до высоты содержимого iFrame. Мне нужно щелкнуть файл NavBox.htm (также iFrame'd на страницу индекса), чтобы отобразить SubFolder / SubPage.htm (в основном в виде открытого текста) внутри основного iFrame файла Index.htm и вызвать функцию в Index.htm, которая изменяет высоту элемента в зависимости от длины подстраницы.

Это работает, когда вызывается более длинная страница, но если вызывается более короткая страница, она на самом деле увеличивается в зависимости от размера отступа (20 пикселей), который я добавил (если я снимаю заполнение, он остается того же размера). Я почти уверен, что это простая ошибка в моем синтаксисе, но я не могу заставить высоту пересчитать с новой страницей внутри элемента.

В Index.htm у меня есть следующая функция, которая изменяет высоту элемента: 

function frm_onload(frmname) {
    frmname.frameElement.height = frmname.document.body.scrollHeight+20;
}

Далее идет фактический вызов iFrame: 

<iframe id="Center" width=98%; LANGUAGE=javascript ONLOAD="return frm_onload(Center)" marginwidth="0" marginheight="0" frameborder="0" ></iframe>

На дочерней странице NavBox.htm у меня есть ссылка, которая изменяет содержимое элемента: 

<a href="SubFolder/SubPage.htm" target="Center" onclick="document.getElementById('Center').src=SubFolder/SubPage">SubPage</a>

Так что, если я думаю прямо, есть ли что-то, чего я не понимаю из функции, или мне нужна ссылка в NavBox, чтобы сделать больше. Большое спасибо за любую помощь, которую вы, ребята, можете оказать!

1 Ответ

0 голосов
/ 18 февраля 2012

Я ответил на вопрос, очень похожий на этот здесь . Вы можете использовать эту функцию: 

function addCSSToParent(url) {
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.href = url;
    link.type = 'text/css';
    window.parent.document.getElementsByTagName('head')[0].appendChild(link);
}

// Add some CSS
addCSSToParent('some.css');

Это позволит вам прикрепить файл .css для стилизации родительского элемента. Вы можете получить доступ к родительскому документу изнутри iframe в jQuery с помощью $(window.parent.document). Поэтому вам просто нужно добавить файл css в родительский файл или определить стиль высоты элемента с помощью jQuery.

...