iFrame - Automatische Höhe auf die Inhalte zu ändern, innerhalb von iFrame

Ich habe den folgenden code:-

<script language="javascript" type="text/javascript">
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>

<div class="resizable">
    <iframe src="http://yellow-taxi.co.uk/onlinebooking/index.php" frameborder="0" width="100%" height="100%" scrolling="no" onload="resizeIframe(this)"></iframe>
</div>

Dem Javascript geht es in der Höhe zu justieren, was die anfängliche Höhe des iFrame ist, aber die Höhe des iFrames erhöht, wie Sie durch den Buchungsprozess. Gibt es eine Möglichkeit zur automatischen Anpassung der Höhe des iFrame auf der Grundlage der Inhalte, die im inneren sieht es wie der Inhalt ändert?

Hinweis: Das iFrame wird angezeigt, auf der gleichen Domäne wie der iFrame src.

  • Hast du irgendwelche javascript-Bibliotheken (jQuery) zur Verfügung?
  • Ja jquery-1.9.1.js
InformationsquelleAutor nsilva | 2016-03-03
  1. 2

    Versuchen. Kein Jquery benötigt, aber Sie müssen rufen Sie resizeIframe, wenn sich der Inhalt ändert.

    function resizeIframe(obj) {
    var newheight;
    var newwidth;

    if(document.getElementById){
        newheight = document.getElementById(obj).contentWindow.document .body.scrollHeight;
        newwidth = document.getElementById(obj).contentWindow.document .body.scrollWidth;
    }

    document.getElementById(obj).height = (newheight) + "px";
    document.getElementById(obj).width = (newwidth) + "px";
}

    Hier ein Beispiel für ein iFrame, und die erforderlichen Attribute in es. Sicher sein, rufen Sie die oben genannte Methode mit Ihrem iFrame name.

    <iframe src="yourpage.htm" width="100%" height="300px" id="yourIframe" marginheight="0" frameborder="0" onLoad="resizeIframe('yourIframe');"></iframe>

    Gibt es auch ein nettes JQuery-plugin, das die Aufgabe, und angeblich funktioniert über domains sowie: https://github.com/house9/jquery-iframe-auto-height

    • dies scheint nicht auf die Größe nichts, ich rufe es in jeder Funktion
    • Wie nennst du es? Ich werde aktualisieren, meine Antwort mit dem iFrame-ich verwende in meinem Beispiel.
    • Ich glaube, es ist eine fehlende { Zeile 1 des Codes in dieser Antwort.
    • Es ist in der Tat. Ich aktualisierte die Antwort. Dank Menno!
    InformationsquelleAutor Ageonix
  2. 0

    Lange Geschichte kurz zu, Sie können nicht, es sei denn, Ihre Seite auf der gleichen Domäne wie der iframe-Seite. Sie haben führen Sie in einem cross-domain-Einschränkung, und als Sicherheitsmaßnahme eingerichtet, die von Ihrem browser, werden Sie nicht in der Lage, Zugang JS, DOM-Elemente oder Eigenschaften, die innerhalb des iframe-Inhalts.

    ALSO Erklärung

    • Das iFrame auf der gleichen domain.
    InformationsquelleAutor Jon
Schreibe einen Kommentar