1

I would like to create a div overlay over videos in a html page. The videos could be embedded YouTube videos, or from any other source. Any ideas on how to do this? I have done a similar task of overlaying divs on images but never did for videos. Would greatly appreciate if anyone could point me in the right direction.

dev_musings
  • 1,161
  • 1
  • 10
  • 17

1 Answers1

1

Just make sure wmode="Opaque" or wmode="Transparent" is set on the video embed and the video will recognize its parents' z-index css property.

wmode - Possible values: window, opaque, transparent. Sets the Window Mode property of the Flash movie for transparency, layering, and positioning in the browser.

Josiah Ruddell
  • 29,697
  • 8
  • 65
  • 67
  • The script I am creating will be used over webpages I do not have access to. It dynamically detects videos and calculates their position and then sets the overlay. Can I set wmode property in such cases dynamically? – dev_musings Apr 12 '11 at 17:54
  • So are you saying the "web pages" are within a child (frame) on your current page? – Josiah Ruddell Apr 12 '11 at 17:56
  • No. This script would be used as a widget to display an overlay div for any webpage with video content. Say, you have a blog with embedded videos and you would like have a an overlaying div with some specific content over your videos. Then you should just be able to include my script for that. Since I do not have access to your blog's source code, I would like to make it work on the fly. – dev_musings Apr 12 '11 at 18:03