Comment puis-je superposer une division semi-transparente sur un iFrame YouTube ?

Superposition d'un Div semi-transparent sur un iFrame YouTube

Les vidéos YouTube intégrées dans un iFrame présentent un défi unique lorsque l'on tente de superposer un semi-transparent. -div transparent. Contrairement à la méthode précédente consistant à utiliser un paramètre élément avec wmode="transparent" pour un objet intégré, l'implémentation iFrame требует другой подход.

Comprendre le problème

L'index z d'une vidéo intégrée iFrame est généralement supérieur à tous les autres éléments de la page. Cela signifie que tout div placé dessus sera masqué.

Solution : ajouter "wmode=opaque" à l'URL de l'iFrame

La solution réside dans la modification de l'iFrame YouTube URL en ajoutant un paramètre GET wmode=opaque. Ce paramètre spécifie que la vidéo doit être rendue dans un mode qui permet à d'autres éléments de la superposer.

Utilisation

Pour implémenter cela, ajoutez simplement wmode=opaque comme paramètre premier paramètre dans l’URL source iFrame. Par exemple :

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

Remarque :

• Assurez-vous que wmode=opaque est le premier paramètre de l'URL.
• Autres paramètres doit être ajouté après wmode=opaque.

En suivant ces étapes, vous pouvez superposer avec succès un div semi-transparent sur une vidéo YouTube iFrame intégrée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!