4

I'm doing this:

//z-index of flash objects
$('object').prepend('<param name="wmode" value="opaque">');
$('object embed').attr('wmode', 'opaque');

So, when I inspect the youtube video on my page it says:

<object width="500" height="281">
<param name="wmode" value="opaque">
<param name="movie" value="http://www.youtube.com/v/KUi32-suXjY?version=3&amp;feature=oembed">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<embed src="http://www.youtube.com/v/KUi32-suXjY?version=3&amp;feature=oembed" type="application/x-shockwave-flash" width="500" height="281" allowscriptaccess="always" allowfullscreen="true" wmode="opaque"></object>

I have draggable objects with fixed position and z-index:9999 on my page. However I have no change to make the youtube video stay behind this objects. The youtube video is always on top, even if I set the wmode.

Any idea what I'm doing wrong here?

matt
  • 42,713
  • 103
  • 264
  • 397
  • I believe that Flash always appears on top of the other DOM elements, even if you tell it not to be. – Blazemonger Oct 31 '11 at 18:19
  • no, it is working. I know it. I made it already working once. However that time with direct html code and not with injected html via javascript. Maybe that's the problem? – matt Oct 31 '11 at 18:33
  • 1
    What browser are you using? because in Safari and Firefox I can see the video behind the draggable elements. – Mr_Nizzle Nov 03 '11 at 15:23
  • Ok, thank you, i'm using chrome. Doesn't work in chrome, but seems to work in all other browsers, so screw it. Thank you! – matt Nov 04 '11 at 10:55

2 Answers2

2

Have you tried wmode transparent?

That's what I've used. Not sure what the difference between opaque and transparent is in this context. Using Window Mode (wmode) values

Also not sure, but maybe this will help: difference between opaque and transparent

Community
  • 1
  • 1
Simon Lang
  • 40,171
  • 9
  • 49
  • 58
  • thank you, but doesn't solve the problem … wheter transperent nor opaque seems to work. Don't get why. I posted the link to my question above … maybe you can find out why the youtube video doesn't want to stay behind the black bars. – matt Nov 01 '11 at 19:16
2
<param name="wmode" value="transparent">

Or you can use the new youtube method to embed videos It'd be like:


<iframe class="youtube-player" type="text/html" width="481" height="295" src="http://www.youtube.com/embed/HgLviEa0YHo?wmode=transparent" frameborder="0"> </iframe>

and there it goes with the wmode attribute.

Mr_Nizzle
  • 6,644
  • 12
  • 55
  • 85
  • Thank you, however that's not working for me, cause Wordpress is still using the old embed code. See my link above, maybe you can see what i'm doing wrong here or what i'm missing. – matt Nov 01 '11 at 19:36
  • Well I can see the player behind the draggable elements -> http://twitpic.com/7ae46g – Mr_Nizzle Nov 03 '11 at 15:28