Windows Media Player on top other DIV

Question

I have an embed window media player which is always on top of other DIV tags. I used wmode = opaque; WindowlessVideo = -1 but it does not help. Does anyone know how to make it appear below a certain element of the page.

<object type="application/x-oleobject"
classid="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6" codebase=
"http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
width="345" height="45"><param name="URL" value=
"http://nhacso.net/Music/nghe_song.aspx?id=100004995" />
<param name="EnableContextMenu" value="0" />
<param name="uiMode" value="full" />
<param name="stretchToFit" value="True" />
<param name="AnimationAtStart" value="false" />
<param name="playcount" value="10" />
<param name="Volume" value="100" />
<param name="autostart" value="0" />
<param name="wmode" value="opaque" />
<param name="WindowlessVideo" value="-1" />
<embed src="http://nhacso.net/Music/nghe_song.aspx?id=100004995"
type="application/x-mplayer2" width="345" height="45" align=
"center" border="0" autostart="0" transparentatstart="1"
animationatstart="1" showcontrols="true" showaudiocontrols="1"
showpositioncontrols="0" enablecontextmenu="0" autosize="0"
showstatusbar="1" displaysize="false" playcount="10" wmode="opaque"
windowlessvideo="-1" /></object>

Thanks

Answer 1

The person above is right about z-index, but you don't want position absolute unless there is a relative container div, and even then, position relative will work for you just fine and will allow the object to continue to interact with the layer in terms of pushing things down that are below it and so forth. Position absolute is only good inside of a fixed height container where the height of the elements inside it arent used to push the content of the page down - headers and footers, that sort of thing.

Also, with positioning, it's best practice to position all siblings and their parent. In other words, wherever you start positioning for the purpose of using z-index on something inside, you should position and z-index all sibling elements inside there. It's cleaner and easier to see what's going on when you do.

PS - Option select boxes have similar problems obeying normal z-index rules as well.

Answer 2

I had the same issue and resolved it thusly:

<param name="windowlessVideo" value="true">

Using "-1" for a boolean value may or may not work as expected.

Answer 3

What worked for me was putting the Z-index to -1 this part of code u need to change

Answer 4

I have had a similar experience doing the same thing with *.swf objects. I'm uncertain whether the same solution will work here, but it's worth a shot. When defining z-index, you also have to designate position: absolute for the div that the object tag sits in.

Answer 5

<param name="windowlessVideo" value="true">

This work perfactly.

Thanks