Wie kann ich ein undurchsichtiges Div auf einem YouTube-iFrame überlagern?

Opaque Div über YouTube iFrame überlagern

Das Einbetten von YouTube-Videos mithilfe von iFrames stellt eine Herausforderung dar, wenn versucht wird, ein transparentes Div zu überlagern. Während frühere Methoden mit wmode="transparent" nicht mehr auf iFrames anwendbar sind, gibt es eine Lösung, die das Hinzufügen eines undurchsichtigen div ermöglicht.

Der Schlüssel liegt im Anhängen des GET-Parameters „wmode=opaque“ an die YouTube-URL. Dieser Parameter weist den iFrame an, den undurchsichtigen Modus zu verwenden, was zu einem Z-Index führt, der unter dem anderer Elemente liegt.

Um dies auf den bereitgestellten Code anzuwenden, aktualisieren Sie einfach die URL im iFrame-Tag wie folgt:

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

Beachten Sie, dass „wmode=opaque“ der erste Parameter in der URL sein sollte, gefolgt von allen anderen Parametern. Sobald diese Änderung vorgenommen wurde, überlagert das Div mit der ID „Overlay“ erfolgreich das YouTube-Video mit der gewünschten Deckkraft.

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