Resizer - скрипт, который автоматически подстраивает высоту IFrame-приложения.
Resizer отслеживает положение заданных элементов страницы и изменяет высоту IFrame так, чтобы эти элементы оставались видимыми.
-
Разместите на своем сервере файл
resizer.min.js -
В тег
HEADдобавьте следующий код:<script type="text/javascript" src="resizer.min.js"></script>
После подключения файла resizer.min.js становится доступным глобальный объект Resizer, который имеет следующие методы:
-
Resizer.add(element[, extra])- добавляетelementв список отслеживаемых объектов. Возвращает объектResizer. В качествеelementможет быть передан либо id элемента, либо сам элемент, либо массив элементов или их id. Параметрextraзадает отступ от нижнего края элемента. Важно! На момент вызова этого метода добавляемые элементы должны существовать.<script type="text/javascript"> // Примеры вызова метода Resizer.add Resizer.add(document.body); Resizer.add('content', 30); Resizer.add(document.getElementsByClassName('message_box')); Resizer.add(['tooltip1', 'tooltip2'], 10); </script> -
Resizer.setInterval(interval)- устанавливает интервал между вызовами функции проверки изменения высоты в миллисекундах. Возвращает объектResizer. По умолчанию интервал равен100.
Для того, чтобы Resizer начал работу достаточно добавить хотя бы один элемент.
Обычно для приложения достаточно одного вызова Resizer.add после загрузки страницы:
<body onload="Resizer.add(document.body);">
...
</body>
Однако, если в приложении есть элементы с абсолютным позиционированием, которые могут выйти за границы body (выпадающие списки, окна, всплывающие подсказки, etc), их также необходимо добавить в список:
...
<div id="user_tooltip" style="position: absolute; left: 30px; top: 1150px;">Это Вы</div>
...
<script type="text/javascript">
Resizer.add('user_tooltip', 20);
</script>