iframe Höhe automatisch anpassen, wenn sich der Inhalt ändert
Ich habe einen iframe, wie Sie auf dem folgenden Link sehen können; -
Der iFrame ist die Online-Buchung in der Mitte des Bildschirms. Das Problem, das ich habe, ist, dass obwohl die Höhe des Iframes in Ordnung ist, wenn die Seite geladen wird, ich es irgendwie brauchen muss, um die Höhe automatisch anzupassen, wenn der Seiteninhalt angepasst wird. Wenn ich beispielsweise eine Postleitzahlensuche in der Online-Buchung durchführe, wird ein Dropdown-Menü erstellt und die Schaltfläche "Nächster Schritt" wird nicht angezeigt.
Was ich tun muss ist, dass wenn sich der Inhalt der Online-Buchung ändert, sich der iframe automatisch an die neue Höhe des iframe anpasst (dynamisch), da keine anderen Seiten geladen werden.
Ich habe verschiedene Skripte mit jquery ausprobiert, um dieses Problem zu beheben, aber alle passen die Höhe des Iframes anscheinend nur beim ersten Laden der Seite und automatisch annicht wenn sich der Inhalt des iframe ändert.
Ist das überhaupt möglich?
Der Code, den ich im Moment habe, ist mit einer eingestellten Höhe im Moment: -
<div id="main-online-booking">
<iframe id="main-online-frame" class="booking-dimensions" src="http://www.marandy.com/one2oneob/login-guest.php" scrolling="no" frameborder="0"></iframe>
</div>
#main-online-booking {
height: 488px;
border-bottom: 6px #939393 solid;
border-left: 6px #939393 solid;
border-right: 6px #939393 solid;
z-index: 4;
background-color: #fff;
}
.booking-dimensions {
width: 620px;
height: 488px;
}
Wenn mir jemand dabei helfen kann, wäre ich sehr dankbar!