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

Lösen Sie das Problem, dass await in forEach nicht funktioniert

1. Einleitung Vor ein paar Tagen bin ich bei der ...

Detaillierte Erläuterung der Konfiguration und Optimierung des statischen Nginx-Dateidienstes

Stammverzeichnis und Indexdatei Die Root-Direktiv...

Docker-Container: benutzerdefinierter Host-Netzwerkzugriffsvorgang

Durch Hinzufügen des Schlüsselworts extra_hosts i...

Vue-Routing - Methode zum Sprung relativer Pfade

Inhaltsverzeichnis Relativer Pfadsprung im Vue-Ro...

Zwei Methoden der MySql-Kommaverkettungs-Stringabfrage

Die folgenden beiden Funktionen werden auf die gl...

So führen Sie PostgreSQL mit Docker aus

1. Installieren Sie Docker. Referenz-URL: Docker-...

NULL und leere Zeichenfolge in MySQL

Ich bin vor kurzem mit MySQL in Berührung gekomme...

Analyse des Implementierungsprozesses der drei Modi des VMWare-Netzwerkadapters

Drei Modi Bridged (Bridge-Modus), NAT (Network Ad...

Zentrieren des Formulars in HTML

Ich bin einmal auf eine Aufgabe gestoßen, bei der...

So überprüfen und organisieren Sie Websitedateien mit Dreamweaver8

Was ist der Zweck der Erstellung einer eigenen Web...

Nginx verbietet den direkten Zugriff über IP und leitet auf eine benutzerdefinierte 500-Seite weiter

Direkt zur Konfigurationsdatei Server { listen 80...

Tutorial zur Installation der DAMO-Datenbank auf Centos7

1. Vorbereitung Nach der Installation des Linux-B...

Eine detaillierte Erklärung der DIV+CSS-Benennungsregeln kann zur SEO-Optimierung beitragen

1. Benennungskonventionen für CSS-Dateien Vorschl...

So implementieren Sie das mobile Anmelde- und Registrierungsmodul elegant in vue3

Inhaltsverzeichnis Vorwort Eingabefeldkomponente ...

Müssen die Texte der Website noch gestaltet werden?

Viele fragen sich vielleicht: Muss der Text auf d...