Maison >interface Web >tutoriel CSS >Comment puis-je superposer un Div opaque sur un iFrame YouTube ?
Superposition d'un div opaque sur YouTube iFrame
L'intégration de vidéos YouTube à l'aide d'iFrames présente un défi lorsque l'on tente de superposer un div transparent. Alors que les méthodes précédentes impliquant wmode="transparent" ne sont plus applicables aux iFrames, il existe une solution qui permet d'ajouter un div opaque.
La clé réside dans l'ajout du paramètre GET "wmode=opaque" à l'URL de YouTube. Ce paramètre demande à l'iFrame d'utiliser le mode opaque, ce qui entraîne un z-index inférieur à celui des autres éléments.
Pour appliquer cela au code fourni, mettez simplement à jour l'URL dans la balise iFrame comme suit :
<iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ?wmode=opaque" frameborder="0"></iframe>
Notez que "wmode=opaque" doit être le premier paramètre de l'URL, suivi de tout autre paramètre. Une fois cette modification effectuée, le div avec ID "overlay" superposera avec succès la vidéo YouTube avec l'opacité souhaité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!