Detailliertes Beispiel für die Blockierung von Flash durch HTML-Elemente

Detailliertes Beispiel für die Blockierung von Flash durch HTML-Elemente


Code kopieren
Der Code lautet wie folgt:

wmode-Parameter:
Transparenter Modus: Sie können den Z-Index verwenden, um die Hierarchie zu steuern
Opaque-Modus: Sie können den Z-Index verwenden, um die Hierarchie zu steuern
Fenstermodus: Flash wird über das Hauptanzeigefenster des Browsers gelegt und deckt das HTML ab, das sich damit überlappt.

Szenario 1 (Wmode-Parameter des Flashs kann geändert werden)
Ändern Sie die wmode-Eigenschaft auf transparent oder undurchsichtig

Die DEMO sieht wie folgt aus:


Code kopieren
Der Code lautet wie folgt:

<!doctype html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>HTML-Elemente blockieren Flash – Szenario 1</title>
<Stil>
html, Body, Objekt, Einbettung{ \u200b\u200bPadding: 0; Margin: 0;}
.m-box { position: relativ; }</p> <p> .m-flash, .m-flash embed { width: 400px; }
.m-shadow { Position: absolut; oben: 0; links: 0; Breite: 100px; Höhe: 100px; Hintergrundfarbe: #ccc; }
</Stil>
</Kopf>
<Text>
<!--transparent-->
<div Klasse="m-box">
<Objektklasse="m-flash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="src" value="<a href="http://www.aa.net/i/bookmark.swf">http://www.aa.net/i/bookmark.swf</a>">
<param name="wmode" value="transparent"/>
<embed wmode="transparent" src="<a href="http://www.aa.net/i/bookmark.swf"></embed">http://www.aa.net/i/bookmark.swf"></embed</a>>
</object></p> <p> <div Klasse="m-shadow">
Jununx, willkommen! --transparent
</div>
</div></p> <p><!--undurchsichtig-->
<div Klasse="m-box">
<Objektklasse="m-flash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="src" value="<a href="http://www.aa.net/i/bookmark.swf">http://www.aa.net/i/bookmark.swf</a>">
<param name="wmode" value="undurchsichtig"/>
<embed wmode="undurchsichtig" src="<a href="http://www.aa.net/i/bookmark.swf"></embed">http://www.aa.net/i/bookmark.swf"></embed</a>>
</object></p> <p> <div Klasse="m-shadow">
Jununx, willkommen! --undurchsichtig
</div>
</div></p> <p></body>
</html>

Szenario 2 (Flash-Wmode-Parameter kann nicht geändert werden) – Flash und Ihre Iframe-Maske befinden sich auf derselben Seite. Hinweis: Wenn Sie mit Safari und Opera kompatibel sein möchten, teilen Sie ihnen bitte direkt mit, dass diese Maske nicht verwendet werden kann.

Die DEMO sieht wie folgt aus:


Code kopieren
Der Code lautet wie folgt:

<!doctype html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>HTML-Elemente blockieren Flash – Szenario 2</title>
<Stil>
html, Body, Objekt, Einbettung{ \u200b\u200bPadding: 0; Margin: 0;}
.m-box { position: relativ; }</p> <p> .m-flash, .m-flash embed { width: 400px; }
.m-flash { position: relativ; z-index: 1; }
.m-shadow { Position: absolut; oben: 0; links: 0; Z-Index: 2; Breite: 100px; Höhe: 100px; Hintergrundfarbe: #ccc; }
.m-shadow-txt { position: absolut; z-index: 2; }
.m-shadow-ifr { Position: absolut; Z-Index: -1; Breite: 100 %; Höhe: 100 %; Deckkraft: 0; Filter: Alpha (Deckkraft = 0); }
</Stil>
</Kopf>
<Text>
<!--Fenster-->
<div Klasse="m-box">
<Objektklasse="m-flash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="src" value="<a href="http://www.aa.net/i/bookmark.swf">http://www.aa.net/i/bookmark.swf</a>">
<param name="wmode" value="Fenster"/>
<embed wmode="Fenster" src="<a href="http://www.aa.net/i/bookmark.swf"></embed">http://www.aa.net/i/bookmark.swf"></embed</a>>
</object></p> <p> <div Klasse="m-shadow">
<div class="m-shadow-txt">Jununx, willkommen! --window</div>
<iframe class="m-shadow-ifr" frameborder="0"></iframe>
</div>
</div></p> <p></body>
</html>

Szenario 3 (der Wmode-Parameter von Flash kann nicht geändert werden) – Flash wird von einer Iframe-Seite eingeführt. Hinweis: Wenn Sie keine Berechtigung zum Betreiben der Iframe-Seite haben, teilen Sie dem Anforderer bitte direkt mit, dass dies nicht blockiert werden kann. Hinweis: Wenn Sie mit Safari und Opera kompatibel sein möchten, teilen Sie dem Anforderer bitte direkt mit, dass dies nicht blockiert werden kann.

DEMO-Seite:


Code kopieren
Der Code lautet wie folgt:

<!doctype html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>HTML-Elemente blockieren Flash – Szenario 2</title>
<Stil>
html, Body, Objekt, Einbettung{ \u200b\u200bPadding: 0; Margin: 0;}
.m-box { position: relativ; }</p> <p> .m-flash { position: relativ; Breite: 400px; Höhe: 400px; z-index: 1; }
.m-shadow { Position: absolut; oben: 0; links: 0; Z-Index: 2; Breite: 100px; Höhe: 100px; Hintergrundfarbe: #ccc; }
.m-shadow-txt { position: absolut; z-index: 2; }
.m-shadow-ifr { Position: absolut; Z-Index: -1; Breite: 100 %; Höhe: 100 %; Deckkraft: 0; Filter: Alpha (Deckkraft = 0); }
</Stil>
</Kopf>
<Text>
<!--Fenster-->
<div Klasse="m-box">
<iframe class="m-flash" src="ifr.html" frameborder="0"></iframe></p> <p> <div class="m-shadow">
<div class="m-shadow-txt">Jununx, willkommen! --window</div>
<iframe class="m-shadow-ifr" frameborder="0"></iframe>
</div>
</div></p> <p></body>
</html>

Iframe-Seite:


Code kopieren
Der Code lautet wie folgt:

<!doctype html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>HTML-Elemente blockieren Flash – Szenario 3</title>
<Stil>
html, Body, Objekt, Einbettung{ \u200b\u200bPadding: 0; Margin: 0;}
.ifr { Position: absolut; Z-Index: 2; Breite: 100px; Höhe: 100px; Deckkraft: 0; Filter: Alpha (Deckkraft = 0); }
.m-flash { Position: absolut; Z-Index: 1; Breite: 400px; }
</Stil>
</Kopf>
<Text>
<!--Fenster-->
<Objektklasse="m-flash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="src" value="<a href="http://www.aa.net/i/bookmark.swf">http://www.aa.net/i/bookmark.swf</a>">
<param name="wmode" value="Fenster"/>
<embed wmode="Fenster" src="<a href="http://www.aa.cn/i/bookmark.swf"></embed">http://www.aa.cn/i/bookmark.swf"></embed</a>>
</object></p> <p><iframe class="ifr" frameborder="0"></iframe>
</body>
</html>

<<:  Detaillierte Erklärung des verschiebbaren und bearbeitbaren Gantt-Diagramms (Highcharts können für Vue und React verwendet werden)

>>:  So erstellen Sie einen Styleguide für Ihre Website im Webinterface-Design (mit Bildern und Text)

Artikel empfehlen

Über die VMware vCenter-Sicherheitslücke beim unbefugten Hochladen beliebiger Dateien (CVE-2021-21972)

Hintergrund CVE-2021-21972 Eine nicht authentifiz...

Über den Startfehler, der durch Inkompatibilität zwischen VMware-Workstations und Gerät/Anmeldeinformationen verursacht wird

VMware-Workstations starten den virtuellen Maschi...

Nginx definiert die Zugriffsmethode für Domänennamen

Ich erstelle derzeit Nginx, kann aber nicht über ...

Optimierung von JavaScript und CSS zur Verbesserung der Website-Leistung

<br /> Im ersten und zweiten Teil haben wir ...

Verwenden Sie Tomcat, um das SpringBoot-War-Paket in einer CentOS-Umgebung bereitzustellen

Kriegspaket vorbereiten 1. Bereiten Sie das vorha...

So richten Sie die Verwendung der chinesischen Eingabemethode in Ubuntu 18.04 ein

In der neuesten Version von Ubuntu müssen Benutze...

Überwachen Sie die Größenänderung eines DOM-Elements über Iframe

Ein während des Entwicklungsprozesses häufig auft...

Detaillierte Erklärung zur JavaScript-Datenabflachung

Inhaltsverzeichnis Was ist Abflachung? Rekursion ...

Ein zeitaufwändiger Fehlerbehebungsprozess für einen Docker-Fehler

Inhaltsverzeichnis Herkunft Umweltinformationen F...

Detailliertes Tutorial zur Verwendung von Docker zum Erstellen einer Laravel-Entwicklungsumgebung in der Win10-Home-Version

Betriebssystem: Win10 Home Edition Installieren S...

So passen Sie die Protokollebene von Nginx in Docker an

Inhaltsverzeichnis Einleitung Nginx-Dockerdatei N...

Zusammenfassung verschiedener Möglichkeiten zum Erstellen von Objekten in js und ihrer Vor- und Nachteile

Inhaltsverzeichnis Frühe Erstellungsmethode Fabri...

Analyse des allgemeinen MySQL-Abfrageprotokolls und des langsamen Abfrageprotokolls

Die Protokolle in MySQL umfassen: Fehlerprotokoll...

Zusammenfassung zum horizontal scrollenden Website-Design

Horizontales Scrollen ist nicht in allen Situation...

Natives JS zur Implementierung eines Dropdown-Menüs

Dropdown-Menüs sind auch im wirklichen Leben weit...