how to embed WMV files in my html file

Question

i have made some demo movies in WMV format that i want to embed in my html page. I've found some code to do that, but one thing annoys me: it shows a black front in stead of a picture of the first frame. And i can ofcourse put some descriptive text around the frames/movies, but it isn;t such a nice sight: all black squares with a play button beneath it. What do i have to do to show a (first) frame of the movie?

This is my code:

classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" standby="Loading Microsoft® Windows® Media Player components..." type="application/x-oleobject" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsm p2inf.cab#Version=6,4,7,1112"> 
<param name="filename" value="http://www.ladieda.com/mymovie.wmv"> 
<param name="autoStart" value="false"> 
<param name="showControls" value="true"> 
<param name="AllowChangeDisplaySize" value="true"> 
<param name="ClickToPlay" value="true"> 
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" SRC="http://www.ladieda.com/mymovie.wmv" AutoStart="false" ></embed>
</object>

Michel

Ps tried it in IE8 and FF3.6, both showed up black.

Distinctive

Answer 1

My example works.

<object id='mediaPlayer' width="320" height="285" 
      classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95' 
      codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
      standby='Loading Microsoft Windows Media Player components...' type='application/x-oleobject'>
      <param name='fileName' value="http://www.ladieda.com/mymovie.wmv">
      <param name='animationatStart' value='true'>
      <param name='transparentatStart' value='true'>
      <param name='autoStart' value="false">
      <param name='showControls' value="true">
      <param name='loop' value="true">
      <embed type='application/x-mplayer2'
        pluginspage='http://microsoft.com/windows/mediaplayer/en/download/'
        id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='-1' 
        bgcolor='darkblue' showcontrols="true" showtracker='-1' 
        showdisplay='0' showstatusbar='-1' videoborder3d='-1' width="320" height="285"
        src="http://www.ladieda.com/mymovie.wmv" autostart="true" designtimesp='5311' loop="true">
      </embed>
      </object>

Your example was modified to work:

<object classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" standby="Loading Microsoft® Windows® Media Player components..." type="application/x-oleobject" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsm p2inf.cab#Version=6,4,7,1112"> 
<param name="fileName" value="http://www.ladieda.com/mymovie.wmv"> 
<param name="autoStart" value="false"> 
<param name="showControls" value="true"> 
<param name="AllowChangeDisplaySize" value="true"> 
<param name="ClickToPlay" value="true"> 
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" src="http://www.ladieda.com/mymovie.wmv" autoStart="false" ></embed>
</object>

And yes, it works both on Firefox 3.6 and IE8 (I tested it myself).

Socage

Hi, i've uploaded a live sample, but still a black rectangle here: verfrisser.net/tst/test2.html – Distinctive

They do give a preview image in windows explorer. – Distinctive

they are movies from a Flip video camera, which are natively MP4 – Distinctive

Strange, I can see the player. The reference to the file "ladieda.com/mymovie.wmv" doesn't exist (and I tested using VLC and WMPlayer 11) – Socage

Windows Media Player cannot play MP4 format if I'm not mistaken. – Socage

I converted them to the WMV format. I did change the reference from ladieda.com to the real files.. – Distinctive

At my (IE8) screen the movies show up as 1 black mediaplayer and 4 white ones, is that the same at your computer? – Distinctive

I converted the MP4 files to WMV with the FlipCamera software, and also (for the 4th and 5th one) windows movie maker to create new WMV's (just in case the FlipCamera software creates some kind of 'buggy' WMV's) – Distinctive

@Michel, this is the cause why your mediaplayer starts as white. <param name='transparentatStart' value='true'>. Do you want the movie to play? By clicking the path directly to the video file, it seems that the file isn't in the server as you think it is. – Socage

@TEG, No, i don't want the video's te play right away, because i want to place a series on the page, and in that case they will all start at the same time. The movies are on the server, because when i click 'play' the video plays (did you check the uri? verfrisser.net/tst/test2.html) But for instance the first one show black in stead of a preview of the movie, does it show a black rectangle at the first one too? – Distinctive

@Michel, If you never specify auto-play, the player will never do anything because nothing is buffered. Buffering starts on play. The cause of why the display was white, I've already mentioned it. The first player doesn't have the transparentatStart attribute. – Socage

Ok, maybe i'm not being clear enough on this. I'll try to explain a bit clearer: If you go to this page (photofacts.nl/fotografie/rubriek/video_tutorials/…) you see a embedded video (it is not a WMV by the way). For this video you don't see a blank or transparent or black window, but the first frame of the video. That is what i want to achieve: show the first frame in stead of the blank or transparent or black window. PS Thanks for your effort so far! – Distinctive

From the example you gave me, you cannot use WMPlayer for it (unless it's possible, but I'm not certain of as yet). What Youtube does is it creates an image of the videos uploaded (by retrieving random frame from video) and displays it as 1st frame. The video isn't buffered until you click play. E.g. youtube video image buffer (i.ytimg.com/vi/h6DmEgtibOg/2.jpg) – Socage

aha, maybe i'll do that too, just read a frame to create a preview image. Thanks for your replies! – Distinctive

It doesn't work in FF3.6 for me, only in IE(8). Any idea why? In FF, the space for the video remains black. – Eikon

@The Elite Gentleman yes, I had some problems with your sample. But I figured out that it only works in FF if the video URL is absolute, not relative. – Eikon

One problem with FF is still there though: the movie won't scale if it the width/height params are smaller than the actual movie size. – Eikon

...even with stretchToFit='1' param set – Eikon

try stretchToFit="true". Look @ (gravlab.com/forum/2007/09/06/…) – Socage

Answer 2

<param name="fileName" value="http://www.ladieda.com/mymovie.wmv">  is good for ff

for IE should use name="URL"

too lazy to provide link to msdn.

Kristinkristina

you serious? too lazy to provide? wtf – Euler

At this point, you might as well just delete your answer or edit it so it's not as "lazy" – Ryals

Never say that you're too lazy to provide information. Not very good. – Vtol