Как растянуть Iframe по высоте загружаемого в него окна

Тема в разделе "HTML, CSS, XML, JavaScript", создана пользователем toha, 22 фев 2010.

  1. toha

    toha Гость

    Здравствуйте. Помогите пожалуйста по следующему вопросу. Мне нужно зделать так чтобы iframe автоматически растягивался по высоте загружаемого в него окна. Есть код:
    Код (Text):
    <script type="text/javascript">
    <!--
    var timeout;

    function clickAction() {
    frameFitting();
    var fr = document.getElementById('demo_frame').contentWindow.document.body.getElementsByTagName('a');
    for (var i=0; i<fr.length; i++) {
    fr[i].onclick = function() {
    clearInterval(timeout);
    timeout = setInterval("frameFitting()",100);
    }
    }
    }

    function frameFitting() {
    document.getElementById('demo_frame').width = '100%';
    document.getElementById('demo_frame').height = document.getElementById('demo_frame').contentWindow.document.body.scrollHeight+4+'px';
    }

    onload = clickAction;
    //-->
    </script>
    Код (Text):
    <iframe src="pred.html" style='width: 100%;' frameborder=5 marginheight=0 marginwidth=0 onload='o=this.contentWindow.document.body; this.style.height=o.scrollHeight; this.style.height=o.scrollHeight-o.clientHeight+o.offsetHeight;' id="demo_frame" name="content" hspace=0 height="500px"></iframe>
    В IE все нормально работает, в Opera 9.52 тоже нормально а вот в Opera 9.27 этот iframe становится почти в 2 раза больше чем надо а в мозилле он становится каким надо по размеру только после обновления страницы. Может есть какиенибудь кроссбраузерные скрипты по этой теме или этот скрипт можно настроить под особенности разных браузеров.
     
  2. BlackApricot

    BlackApricot Гость

    Твой код ещё не смотрел, это так, на вскидку.
    У меня опера 9.25 и 9.63, так они по разному возвращают высоту, возможно у тебя именно эта проблема. По версиям похоже. А лиса иной раз хочет чтобы её таймером притормозили, не успевает она в некоторых местах.
    Сейчас заберу твоё, посмотрю. Любопытно.
     
  3. Rus59Wolf

    Rus59Wolf Гость

    Задача стояла на пхп сделать некую систему. управление этой системы было в iframe. Причем там надо было забивать нехилых размеров табличку. Все не влазило - решил поискать авторастягивание фрейма. Нашел коечего, но был большой трабл с оперой, а именно ее предполагалось использовать.
    Трабл был в том что опера забывает обнулить значения параметров фрейма (тобишь самой странички что в него подгружает). Лечил так - содержимое фрейма заключал наглухо в таблицу из одной строки и одного столбца. Причем для столбца и строки задавал значения ширины и высоты соответственно чтобы фрейм не мог быть меньше этих размеров нуникак.

    При onLoad соответственно window.parent.document.getElementById("idrameId").height уравнивал на высоту ТАБЛИЦЫ, и чутьчуть увеличивал.

    <script type="text/javascript">
    function LoadAction() {
    window.parent.document.getElementById("FRAME").height = document.getElementById("svt").offsetHeight+20+'px';
    }
    onload = LoadAction;
    </script>
    <table cellpadding="0" cellspacing="0" width="98%" id="svt" name="svt">
    <tr HEIGHT="300"><td>
    ---содержимое фрейма---
    </td></tr></table>

    Собственно вот это вешаем не в родительскую страницу а в ту, что подгружаем фреймом.
    Пробовал тоже провернуть через DIV - не получилось. Может чего не понял. Можно посмотреть хороший пример кода здесь - http://pontyk.com.ua/2010/03/10/uravnivani...hyu-javascript/
    автор как раз вытягивает высоту блока заданного дивом. Но у меня не получилось а через таблицу пошло сразу

    Теперь о птичках. Собсвенно свою задачу я решил - у меня все шло через шаблоны и чуть подправив один все становилось резко гуд. Допустим мы хотитм в энтот фрейм подгружать содержимое какого готового сайта - неважно зачем. для рекламы там или как чат вставляем. Тут решение уже некатит ибо код чужого сайта на предмет подправить в нем табличку и скриптик (маленький суда дабавым дэ) уже не катит.
    Однако наверно можно траблу решить через аякс. Смысл в чем. Страницу фрейма делаем заглушкой. - Это пустая страница с табличкой, скриптом изменения размера фрейма и скриптами аякса, которые довольно просты и приводить их не буду. НО скрипты аякса надо поправить - Во первых: если мы тупо подгрузим левую страницу аяксом и положим сюда то она займет место текущей страницы - соответственно скрипта изменения размера не будет, как и таблички.
    Во вторых скрипт изменения размера должен запускатся после добавления содержимого (причем содержимое должно втыкаться в табличку и очищатся от тэгов до боди и после боди включительно, что опять же не хорошо ибо можно потерять родные скрипты что прописаны были в хэде)
    Ну и в третьих в пригруженной страничке нужно поправить все переходы чтобы они проходили через аякс систему заглушки. Такая вот петрушка. ];) не BRAIN*цензура* конечно но тоже весело - в общем товарищи под каждый случай придется применять свое решение.
     
Загрузка...

Поделиться этой страницей