Настройка высоты и ширины фрейма при загрузке страницы - PullRequest
Новая
       2

Настройка высоты и ширины фрейма при загрузке страницы

1 голос
/ 23 ноября 2011

У меня есть три фрейма на моей HTML-странице.Один закрывает верхнюю половину окна.Два других находятся под ним, покрывая равную ширину в остальной части экрана. 

-----------------------------
|                           |
|                           |
-----------------------------
|             |             |  
|             |             |
-----------------------------

Я изменяю высоту и ширину фреймов в событии onreadystatechange.В результате при первой загрузке эти фреймы выглядят как три точки на экране и не изменяют размер.При обновлении они отображаются идеально.

Код: 

function resize_iframes()
{
    var upper_td = document.getElementById("upper_td");
    upper_td.style.height = window.innerHeight/2;

    var upper_frame = document.getElementById("upper_frame");
    upper_frame.src = "http://www.google.com";
    upper_frame.style.height = window.innerHeight/2;
    upper_frame.style.width = window.innerWidth;

    var left_td = document.getElementById("left_td");
    left_td.style.width = window.innerWidth/2;
    left_td.style.height = window.innerHeight/2;

    var left_frame = document.getElementById("left_frame");
    left_frame.src = "http://www.google.com";
    left_frame.style.height = window.innerHeight/2;
    left_frame.style.width = window.innerWidth/2;

    var right_td = document.getElementById("right_td");
    right_td.style.width = window.innerWidth/2;
    right_td.style.height = window.innerHeight/2;

    var right_frame = document.getElementById("right_frame");
    right_frame.src = "http://www.google.com";
    right_frame.style.height = window.innerHeight/2;
    right_frame.style.width = window.innerWidth/2;
}

URL-адреса по умолчанию считаются "http://www.google.com";, оригинальные URL-адреса не отображаются. Какое возможное решение дляправильно ли отображать фреймы при первой загрузке?

Ответы [ 2 ]

0 голосов
/ 23 ноября 2011

Получил решение .. Просто дождитесь загрузки контента и вызовите эти функции в iframe onload 

<body onload="resize_iframes();">
<table>
    <tr>
        <td colspan="2">
        <iframe id = "upper_frame" onload="resize_upper();"></iframe>
        </td>
    </tr>
    <tr>
        <td align="left">
            <iframe id = "left_frame" onload="resize_left();" sandbox></iframe>
        </td>
        <td align="right">
            <iframe id = "right_frame" onload="resize_right();" sandbox></iframe>
        </td>
    </tr>
</table>

<script>
function resize_iframes()
{
    var upper_frame = document.getElementById("upper_frame");
    upper_frame.src = "http://www.google.com";

    var left_frame = document.getElementById("left_frame");
    left_frame.src = "http://www.google.com";

    var right_frame = document.getElementById("right_frame");
    right_frame.src = "http://www.google.com";
}

function resize_upper()
{
    var upper_frame = document.getElementById("upper_frame");
    upper_frame.style.height = window.innerHeight/2;
    upper_frame.style.width = window.innerWidth;
}


function resize_left()
{
    var left_frame = document.getElementById("left_frame");
    left_frame.style.height = window.innerHeight/2;
    left_frame.style.width = window.innerWidth/2;
}

function resize_right()
{
        var right_frame = document.getElementById("right_frame");
    right_frame.style.height = window.innerHeight/2;
    right_frame.style.width = window.innerWidth/2;
}
</script>
0 голосов
/ 23 ноября 2011

Для этого вам нужно написать метод в javascript и вызвать эту функцию во время загрузки страницы. это метод onload () части тела html.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...