Как автоматически изменять высоту iframe с помощью Jquery?
Любая идея о том, как автоматически изменять высоту iframe на основе его содержимого.
Источник iframe поступает из другого домена.
Есть какие-нибудь мысли о том, как достичь этого с помощью Jquery или собственного JS?
Спасибо
ОБНОВЛЕНИЕ: Этот сценарий отвечал моим потребностям.
Drupal.behaviors.cnngomobile = function (context) {
$(window).bind('load', function(){
var adsIframe = document.getElementById("303799");
if (adsIframe) {
var style = adsIframe.contentWindow.document.createElement("link");
// create <link>
var host = "http://"+location.host+"/sites/all/themes/cnngomobile/css/style-iframe.css";
style.setAttribute("href", host);
style.setAttribute("rel", "stylesheet");
style.setAttribute("type", "text/css");
// append
adsIframe.contentWindow.document.head.appendChild(style);
}
});
};
4 answers
Я реализовал автоматическое изменение размера iframe, используя возможность обмена сообщениями между доменами API window.postMessage() HTML5. Обязательное чтение: http://davidwalsh.name/window-postmessage, http://drupal.org/node/756722.
Пример:
// "Sending" side (iframe)
Drupal.behaviors.yourIframeUpdateBehavior = {}
Drupal.behaviors.yourIframeUpdateBehavior.attach(context, settings) = {
var data = {
'bodyWidth':jQuery('body').width(),
'bodyHeight':jQuery('body').height()
}
var domain = '*'; // Send to any domain.
// Send current document dimensions to any parent of iframe
parent.postMessage(data, domain);
return false;
}
// "Receiving" side (iframe parent)
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
$(window).bind('message', function(event) {
var frameWidthPx = event.originalEvent.data.bodyWidth+'px';
var frameHeightPx = event.originalEvent.data.bodyHeight+'px';
$("#frame_id").width(frameWidthPx);
$("#frame_id").height(frameHeightPx);
});
});
// ]]></script>
Но в прошлом я использовал этот плагин http://www.lost-in-code.com/programming/jquery-auto-iframe-height/
Хммм... разве вы не можете установить ширину или высоту iframe с помощью простого jquery, такого как
$('iframe-id').width('xxxpx');
$('iframe-id').height('xxxpx');
Или сложность заключается в типе данных, которые у вас есть в iframe, и логике определения ширины и высоты iframe... пожалуйста, уточните...
Привет, мне нравится, как здесь внизу- панель инструментов iframe
На самом деле я не хочу добавлять панель инструментов, думая об этом, я просто хочу указать свои iframes, которые находятся в автоматической высоте страниц. Я не понимаю, как реализовать иллюминатор. На самом деле совсем как ниндзя. Может ли кто-нибудь указать нам правильное направление?
Спасибо