So implementieren Sie die adaptive Höhe und Breite von Iframes in JQuery

Dieses Mal werde ich Ihnen jquery zeigen, wie Sie die adaptive Höhe und Breite von Iframe implementieren Ein praktischer Fall. Stehen Sie auf und schauen Sie sich das an.

Javascript

Native und JQuery-Bibliotheken implementieren iframe-adaptive Inhaltshöhe und -breite – jQuery-Code wird empfohlen!

‍<iframe src="index.php" id="mainiframe" name="mainiframe" width="100%" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe>

Code, der auf der Jquery-Bibliothek basiert, ist einfach zu implementieren:

<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
$("#mainframe").load(function(){ 
$(this).height(0); //用于每次刷新时控制IFRAME高度初始化 
var height = $(this).contents().height() + 10; 
$(this).height( height < 500 ? 500 : height ); 
}); 
}); 
</script>

‍ Implementierung basierend auf JS-nativem Code:

<script language="javascript"> 
if (window.parent.length>0){window.parent.document.all.mainframe.style.height=document.body.scrollHeight;} 
</script>

Fügen Sie einfach die Datei hinzu, die Sie von iframe< aufrufen. / body> Dann fügen Sie den obigen Absatz hinzu

Dies kann auch die Höhe des Iframes so steuern, dass er automatisch mit der Menge des Inhalts wächst

<iframe name="web" width="100%" frameborder=0 height="100%" src="index.php" id="web" onload="this.height=web.document.body.scrollHeight+20" ></iframe>

Die jquery-Bibliothek implementiert die Höhe und Breite des iframe-adaptiven Inhalts

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der Schritte für Jquery zum Betreiben von js-Arrays und -Objekten

Detaillierte Erläuterung der Schritte für JQuery zum Entfernen ausgewählter Werte aus einem Array

Das obige ist der detaillierte Inhalt vonSo implementieren Sie die adaptive Höhe und Breite von Iframes in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!