>웹 프론트엔드 >CSS 튜토리얼 >YouTube iFrame 위에 투명한 Div를 오버레이하려면 어떻게 해야 합니까?

YouTube iFrame 위에 투명한 Div를 오버레이하려면 어떻게 해야 합니까?

Linda Hamilton
Linda Hamilton원래의
2024-12-09 06:55:12695검색

How Can I Overlay a Transparent Div Over a YouTube iFrame?

YouTube iFrame에 투명 Div 오버레이

iFrame을 사용하여 YouTube 동영상을 삽입하면 호환성 이점이 있지만, 비디오 위에 투명한 div가 있습니다. 이 문제를 해결하려면 YouTube에서 제공하는 "wmode" GET 매개변수를 활용할 수 있습니다.

해결책:

  1. 매개변수를 추가하여 YouTube 삽입 URL을 수정하세요. "?wmode=opaque"를 URL 끝에 추가합니다. 이렇게 하면 동영상이 "불투명" 모드로 렌더링됩니다.
  2. iframe 태그에서 수정된 URL을 포함하도록 "src" 속성을 업데이트하세요.
<iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ?wmode=opaque" frameborder="0"></iframe>
  1. "위치", "상단", "왼쪽", "너비", "높이", "배경" 등과 같은 속성을 활용하여 그에 따라 오버레이 div의 위치를 ​​지정하고 스타일을 지정합니다. "opacity".

이러한 수정 사항이 구현되면 오버레이 div가 불투명한 YouTube 동영상 위에 올바르게 표시됩니다.

위 내용은 YouTube iFrame 위에 투명한 Div를 오버레이하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.