Wie kann ich ein transparentes Div über einen YouTube-iFrame legen?

Transparentes Div über YouTube-iFrame überlagern

Das Einbetten von YouTube-Videos mithilfe von iFrames bietet zwar Kompatibilitätsvorteile, stellt jedoch eine einzigartige Herausforderung dar, wenn versucht wird, ein zu überlagern transparentes div über dem Video. Um dieses Problem zu beheben, können Sie den von YouTube bereitgestellten GET-Parameter „wmode“ nutzen.

Lösung:

1. Ändern Sie die YouTube-Einbettungs-URL, indem Sie den Parameter anhängen „?wmode=opaque“ am Ende der URL. Dadurch wird sichergestellt, dass das Video im „undurchsichtigen“ Modus gerendert wird.
2. Aktualisieren Sie im iframe-Tag das „src“-Attribut so, dass es die geänderte URL enthält:

<iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ?wmode=opaque" frameborder="0"></iframe>

3. Positionieren und gestalten Sie das Overlay-Div entsprechend und verwenden Sie dabei Eigenschaften wie „Position“, „oben“, „links“, „Breite“, „Höhe“, „Hintergrund“ usw „Opazität“.

Sobald diese Änderungen implementiert sind, wird das Overlay-Div korrekt über dem undurchsichtigen YouTube-Video angezeigt.

Das obige ist der detaillierte Inhalt vonWie kann ich ein transparentes Div über einen YouTube-iFrame legen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!