CodingForums.com - View Single Post - two issues with a working embedded video...

whopub · 02-11-2010, 02:58 AM

No replies yet... but I figured out a few things in the meantime.

First of all, the initial bit of code I showed in the original post doesn't really seem to do anything, in any browser. At least not on IE, which works great without it. So I just removed it.

As for the embed code, I tweaked it a bit, to solve the 'preview image' problem. Basically I placed a background image beneath the video using CSS (I centered it, on video's TR, image has the same size, of course), and turned the 'uiMode' to 'invisible'. It works great, since the image only shows up when the video is not playing. And it even shows up again after you hit stop, or the video ends. It really solves the problem.

So all is great and... hmmm, not really.

Nothing is working on Firefox and Opera! The control buttons don't do anything and the preview image never shows up from beneath the video.

Here's the updated code, which is really working perfectly in IE8:

Code:

<TABLE ID="bump" BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="515" HEIGHT="331">

<TR HEIGHT="288" ID="video_bkg"><TD ALIGN="center">

<EMBED TYPE="application/x-mplayer2" CLASSID="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6" PLUGINSPAGE="http://www.microsoft.com/Windows/Mediaplayer/" SRC="video/pluma.mpg" NAME="pluma2" ID="pluma2" WIDTH="384" HEIGHT="288" ShowControls="0" ShowDisplay="0" ShowStatusBar="0" AutoStart="0" AutoRewind="1" ShowPositionControls="0" ShowTracker="0" FullScreen="0" ClickToPlay="1" AnimationAtStart="0" uiMode="invisible" TransparentAtStart="true"></EMBED>

</TD></TR>

<TR HEIGHT="5"><TD></TD></TR>

<TR HEIGHT="38" VALIGN="bottom"><TD ALIGN="center">

<INPUT TYPE="image" SRC="../images/video/pb_c_1play_out.jpg" WIDTH="36" HEIGHT="37" OnClick="play('pluma2')">

<INPUT TYPE="image" SRC="../images/video/pb_c_2stop_out.jpg" WIDTH="36" HEIGHT="37" OnClick="stop('pluma2')">

<INPUT TYPE="image" SRC="../images/video/pb_c_3pause_out.jpg" WIDTH="36" HEIGHT="37" OnClick="pause('pluma2')">

</TD></TR></TABLE>

This probably can be solved with a bit of javascript tweaking but I don't know how to do it. Any ideas? C'mon people, don't let IE be the good browser here! That would make me sick!

02-11-2010, 02:58 AM	PM User \| #2
whopub New Coder Join Date: Apr 2006 Posts: 29 Thanks: 1 Thanked 0 Times in 0 Posts	No replies yet... but I figured out a few things in the meantime. First of all, the initial bit of code I showed in the original post doesn't really seem to do anything, in any browser. At least not on IE, which works great without it. So I just removed it. As for the embed code, I tweaked it a bit, to solve the 'preview image' problem. Basically I placed a background image beneath the video using CSS (I centered it, on video's TR, image has the same size, of course), and turned the 'uiMode' to 'invisible'. It works great, since the image only shows up when the video is not playing. And it even shows up again after you hit stop, or the video ends. It really solves the problem. So all is great and... hmmm, not really. Nothing is working on Firefox and Opera! The control buttons don't do anything and the preview image never shows up from beneath the video. Here's the updated code, which is really working perfectly in IE8: Code: <TABLE ID="bump" BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="515" HEIGHT="331"> <TR HEIGHT="288" ID="video_bkg"><TD ALIGN="center"> <EMBED TYPE="application/x-mplayer2" CLASSID="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6" PLUGINSPAGE="http://www.microsoft.com/Windows/Mediaplayer/" SRC="video/pluma.mpg" NAME="pluma2" ID="pluma2" WIDTH="384" HEIGHT="288" ShowControls="0" ShowDisplay="0" ShowStatusBar="0" AutoStart="0" AutoRewind="1" ShowPositionControls="0" ShowTracker="0" FullScreen="0" ClickToPlay="1" AnimationAtStart="0" uiMode="invisible" TransparentAtStart="true"></EMBED> </TD></TR> <TR HEIGHT="5"><TD></TD></TR> <TR HEIGHT="38" VALIGN="bottom"><TD ALIGN="center"> <INPUT TYPE="image" SRC="../images/video/pb_c_1play_out.jpg" WIDTH="36" HEIGHT="37" OnClick="play('pluma2')"> <INPUT TYPE="image" SRC="../images/video/pb_c_2stop_out.jpg" WIDTH="36" HEIGHT="37" OnClick="stop('pluma2')"> <INPUT TYPE="image" SRC="../images/video/pb_c_3pause_out.jpg" WIDTH="36" HEIGHT="37" OnClick="pause('pluma2')"> </TD></TR></TABLE> This probably can be solved with a bit of javascript tweaking but I don't know how to do it. Any ideas? C'mon people, don't let IE be the good browser here! That would make me sick!