iFrame-Mehrschichtverschachtelung, unbegrenzte Verschachtelung, hochadaptive Lösung

Es gibt drei Seiten A, B und C. Seite A enthält Seite B und Seite B enthält Seite C. Seite A passt sich Seite B an und Seite C passt sich Seite B an.
A-Seite

Code kopieren

Der Code lautet wie folgt:

Seite B

Code kopieren

Der Code lautet wie folgt:

<Text>

<div Stil="flost:links;">
Linkes Menü
</div>

<div style="flost:right;">
<iframe id="testIframe" name="testIframe" frameborder=0 style="width: 680px;" scrolling="no" src="Seite C"></iframe>
</div>
</body>

Seite C schreibt die folgende JS-Funktion auf die unterste Seite (also die Seite ganz unten) und ruft die Methode im Onload-Ereignis des Textkörpers auf [die folgende Formel ist eine universelle Formel]

Code kopieren

Der Code lautet wie folgt:

<Skripttyp="text/javascript">
//Iframe automatisch erweitern, sodass sich alle übergeordneten Iframes automatisch an die Höhe der enthaltenen Seite anpassen
Funktion autoHeight(){
var doc = Dokument,
p = Fenster;
während(p = p.parent){
var Rahmen = p.Rahmen,
rahmen,
ich = 0;
während(Rahmen = Rahmen[i++]){
wenn (Rahmen.Dokument == doc) {
frame.frameElement.style.height = doc.body.scrollHeight + 'px'; // Bitte beachten Sie, dass Firefox 'px' hinzufügen muss, sonst ist es in Firefox ungültig
doc = S.Dokument;
brechen;
}
}
wenn(p == oben){
brechen;
}
}
}
</Skript>
<body onload="autoHeight();">

<div Stil="Höhe: 1px;">
</div>
<div style="padding-bottom: 10px;"> 
Hier können Sie den eigentlichen Inhalt schreiben und einen Wert für die Polsterung unten des Div festlegen.
</div>
</body>

<<: Gutes Website-Copywriting und gute Benutzererfahrung

>>: MySQL REVOKE zum Löschen von Benutzerberechtigungen

Reines CSS3 realisiert den Effekt des Ein- und Austretens von Divs in der richtigen Reihenfolge

iFrame-Mehrschichtverschachtelung, unbegrenzte Verschachtelung, hochadaptive Lösung

Reines CSS3 realisiert den Effekt des Ein- und Austretens von Divs in der richtigen Reihenfolge

Was sind die Attribute des JSscript-Tags

Detaillierte Erklärung der HTML-Formularelemente (Teil 2)

So öffnen Sie Port 8080 auf dem Alibaba Cloud ECS-Server

Grafisches Tutorial zur Installation und Konfiguration der Mysql5.7.17 winx64.zip-Dekomprimierungsversion

Lösung für das Problem ungültiger Breiteneinstellungen für Label und Span

Die Verbindung zwischen JavaScript und TypeScript

Ubuntu 18.04 installiert MySQL 5.7.23

Grafisches Tutorial zur Installation und Konfiguration von MySQL 5.7.19 (Win10)

Detailliertes Tutorial zur Installation von Nginx 1.16.0 unter Linux

Artikel empfehlen

Das Konzept von MTR in MySQL

Automatisierter Docker-Build – Diagramm des Implementierungsprozesses für automatisierte Builds

Codebeispiel für das Nutzungsszenario der Nginx-Domänenweiterleitung

Die JS-Methode hasOwnProperty() erkennt, ob eine Eigenschaft die eigene Eigenschaft eines Objekts ist.

Was ist SSH? Wie benutzt man? Was sind die Missverständnisse?

Erfahrung in der Gestaltung einer mehrschichtigen Benutzeroberfläche im Webdesign

Eine kurze Erläuterung zur Verwendung des kartesischen Produktprinzips zum Abfragen mehrerer Tabellen in MySQL

Eine vollständige Liste häufig verwendeter HTML-Tags und ihrer Eigenschaften

Detailliertes Tutorial zum Ausführen mehrerer Springboot mit Docker

Detaillierte Erläuterung verschiedener Möglichkeiten zum Abrufen der PID (TID, LWP) von Linux-Threads

Next.js – Erste Schritte-Tutorial

Detaillierte grafische Erläuterung der Hadoop-Installation und -Konfiguration basierend auf Linux7

So konfigurieren Sie ein Jupyter-Notebook im Docker-Container

Beispiel für die Verwendung von CSS3 zum Erstellen eines animierten Pikachu-Hintergrundbilds

Teilen des JS-nativen Quellcodes des Spiels 2048 (das Neueste im Internet)