Как получить высоту iframe с javascript изнутри iframe?А как насчет страниц с несколькими фреймами?

Question

Есть ли способ определить высоту и ширину iframe, выполнив скрипт изнутри iframe?Мне нужно динамически расположить некоторые элементы в iframe в соответствии с разной высотой / шириной iframe.

Будет ли какая-либо разница, если на одной странице будет несколько iframe?т. е. каждый iframe хочет найти свои собственные измерения.

Приветствуются решения Javascript или jquery.

Спасибо!

<iframe src='http://example.com' width='640' height='480' scrolling='no' frameborder='0' longdesc='http://example.com'></iframe>

Ифрамы должны быть встроены в другие сайты, икак упоминалось в одном из ответов ниже, я столкнулся с проблемами с разрешениями.

Answer 1

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

Для этого см .:

• Получить размеры окна просмотра браузера с помощью JavaScript

Или, возможно, это:

• http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/

Answer 2

Помните, что код, подобный следующему:

var thisIframesHeight = window.parent.$("iframe.itsID").height();

будет безопасным, только если источник iframe и родительского окна находятся в одном домене.Если нет, то вы получите проблемы с отказом в разрешении, и вам придется использовать другой подход.

Answer 3

может быть немного поздно, так как все остальные ответы старше :-) но ... вот мое решение. Протестировано в реальных FF, Chrome и Safari 5.0.

CSS:

iframe {border:0; overflow:hidden;}

JavaScript:

$(document).ready(function(){
    $("iframe").load( function () {
        var c = (this.contentWindow || this.contentDocument);
        if (c.document) d = c.document;
        $(this).css({
            height: $(d).outerHeight(),
            width: $(d).outerWidth()
        });
    });
});

Надеюсь, это кому-нибудь поможет.

Answer 4

Каждому <iframe> понадобится id Полагаю. И тогда внутри <iframe> вы бы ссылались на это так:

var thisIframesHeight = window.parent.$("iframe#itsID").height();

Answer 5

да, вы можете выполнять родительскую оконную функцию изнутри фрейма и передавать параметры, например:

window.parent.FUNC_NAME(iframe_height,iframe_width)

просто не забудьте определить функцию FUNC_NAME в родительском окне