Обнаружить изменение высоты содержимого iframe

Есть примеры много примеров, показывающих, как динамически устанавливать высоту iframe в ее содержимое. Это отлично работает для меня. Проблема, с которой я сейчас сталкиваюсь, заключается в том, что содержимое может изменять размер без запуска onload (думаю, скрытый/расширяемый div s).

Есть ли способ обнаружить, когда размер содержимого iframe изменился? Это находится в том же домене и без jQuery.

Ответ 1

Я бы сделал это путем регулярного опроса (возможно, каждые 200 миллисекунд, возможно, чаще) с помощью setInterval. Затем вы можете сравнить размер содержимого с тем, что было в последний раз.

var iframe = document.getElementById('myIframe'),
    lastheight;

setInterval(function(){
    if (iframe.document.body.scrollheight != lastheight) {
        // adjust the iframe size

        lastheight = iframe.document.body.scrollheight;
    }
}, 200);

Ответ 2

Для браузеров, отличных от webkit, существует несколько domMutation-Events, которые срабатывают при изменении атрибута элемента (например, элемента body). См. DOMSubtreeModified и, что более важно, DOMAttrModified.

Интернет-проводник запускает событие onresize даже на не-окна.

Opera отличает события domMutation.

Webkit с другой стороны отменил эти события как компромисс для рендеринга скорости и производительности javascript. Тебе нет другого способа, кроме как проверить с помощью тайм-аута/интервала эффективный размер элемента.