How To Embed a .avi or .mpeg file on a web page?

April 12th, 2004, 1:47 pm

I once had the HTML script to embed a .avi movie file on a web page the same as we do jpg & gif files. No it didn't open up a Media player and I don't want it to, it simply played right in the table and/or frame you put it in. Do anybody know that script, I lost it.

Thanks
cgfX

April 12th, 2004, 2:16 pm

Are you looking for something similar to what I do at this page at my site? If so, I'll post some code for you.

April 12th, 2004, 3:27 pm

CGFX....

Although you haven't responded yet, you may also want to refer to the code I posted in this thread for emac. It is a variation on the same Windows Media Player object and embed controls (for cross-browser compatability), to allow the video to play and work perfectly within all major browsers (eg: MSIE, Netscape/Mozilla, and Opera browsers)

The only difference there is that I had a new "pop-up" window (containing the video) sized to the video file itself opening on its own, instead of with a "select" menu with the video embedded right into the page (as was done at the Wacky Videos page at my site).

You can code it either way. If you need any help with the code to work specifically with your site, post back here and let me know. I had temp-uploaded a working example for emac specific to his site, but the working example was removed from my site earlier today after I received a PM from emac asking me to remove it, now that his problem was solved.

April 12th, 2004, 4:10 pm

Nunzio,

Thank you for your effort to help me out. I went to both of your links, and those where not what I am talking about. Your graphic that you use in here looks like a .avi or mpeg. But I am sure it is a gif file. If I find what I am look for, I will drop you a note.
Thanks
cgfX

April 14th, 2004, 3:20 am

???

I'm confused. Not what you are looking for? I think it is.
This is what you originally posted...

CGFX wrote:

I once had the HTML script to embed a .avi movie file on a web page the same as we do jpg & gif files. No it didn't open up a Media player and I don't want it to, it simply played right in the table and/or frame you put it in. Do anybody know that script, I lost it.

According to what you originally asked, you are looking for a movie to play right within (embedded in) a web page (table - frame - doesn't matter), without the person's media player of choice installed in Windows opening instead to play the movie. Right? That's the way I read your initial post and that is what my response was based on.

I think you misread/misunderstood the references I posted.

Let's isolate just one movie that is part of the selection list at my Wacky Videos page....

http://nunzioweb.com/misc/wacky/rescue_baby.htm

When you click on the above link, a web page opens with the movie embedded right within that page, and the movie begins playing. Unless I'm completely misunderstanding you, that is exactly what you want to do.

So, in case that is what you want (and I'm pretty certain it is), then here is the cross-browser object and embed controls (for cross-browser compatability) used on that page, to allow the video to play and work perfectly within a web page in all major browsers...

Code wrote:

<object id="MediaPlayer1" 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" width="280" height="256">
<param name="fileName" value="Kick_Baby_2.mpg">
<param name="animationatStart" value="true">
<param name="transparentatStart" value="true">
<param name="autoStart" value="true">
<param name="showControls" value="true">
<param name="Volume" value="-450">
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" src="Kick_Baby_2.mpg" name="MediaPlayer1" width=280 height=256 autostart=1 showcontrols=1 volume=-450>
</object>

Just change both instances indicated in red in the above code to point to your .avi movie file instead of mine. That's all.

If you prefer to not have the player controls showing (visible), then change these lines...

Code wrote:

<param name="showControls" value="true">
showcontrols=1

to this instead...

Code wrote:

<param name="showControls" value="false">
showcontrols=0

If you do that though, you may also have to change the 2 instances of the height value of the movie to compensate for the missing controls, to not show any "black" space where the controls should have been.

Example:
Change the 2 height values of 256 to 212 or so. That should embed the movie nicely cross-browser, since the player controls are approximately 44 pixels high.

*Note: width and height values will need to be changed to reflect the size of the actual movie, since different movies have different dimensions. Your movie may be larger/smaller than mine.

April 15th, 2004, 11:52 am

Excellnt, you are correct. Thanks, I guess I did misunderstand.
High 5
cgfX



























i

April 26th, 2004, 8:52 pm

Nunzio390, I saw your wacky videos page and that is exactly what I am attempting for my own page. After much frustration I have decided to start from scratch. Can you help me out.

May 6th, 2004, 6:10 pm

Nunzio,

I found my old school notes with the very code I was looking for. I am going to try yours one day on another project. Your code may work real well or better with another design. But for my business "Animations" page. I wanted it just as it is shown, you are welcome to take a peep at: http://www.clevergraphfix.com/pageOne.htm

Thanks Again,
cgfX

July 21st, 2004, 9:37 pm

I have been doing some testing with embedded movies and have ran into a issue where the embedded player does not respect the letter box / wide screen ratio.

Here is a example of embedded movie incorrect aspect ratio:
http://langleycom.com/g1/movie/Widescreen1
however the correct ratio when not played embedded bit in the popup media-player it plays correctly.
http://langleycom.com/g1/albums/movie/Widescreen1.wmv

I have the <param name="AutoSize" value="1"> and it seems to work correctly except for the wide screen movies.

Any pointers or is this just another media player issue.

Cheers,
Dave

EDIT:
I have been able to fix this by using getID3 to give the movie the correct height and width.

July 21st, 2004, 11:09 pm

CGFX wrote:

I once had the HTML script to embed a .avi movie file on a web page the same as we do jpg & gif files. No it didn't open up a Media player and I don't want it to, it simply played right in the table and/or frame you put it in. Do anybody know that script, I lost it.

Thanks
cgfX

I'm not sure the actual code, but I know Adobe GoLive you can drop the file straight into the page and it embeds it and plays it like you described.

July 22nd, 2004, 1:02 am

Here is the code you all want. I used it to show music videos when I was the webmaster for CRUNK Magazine. It will play .avi, .mpeg, .mov, .swf, and all sound file types except for .rm.

Line number On/Off

Code: Select all

<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="195" width="340" name="CRUNKCinema" align="left">
          <param name="src" value="movietrailers/trailer_sma.mov">
          <param name="autoplay" value="true">
          <param name="controller" value="true">
          <embed height="195" width="340" align="left" src="movietrailers/trailer_sma.mov" autoplay="true" controller="true">
          </embed>
        </object>

Enjoy

July 22nd, 2004, 2:07 am

well done mate

July 22nd, 2004, 3:33 pm

Yeah how do you make it repeat itself? The following is what i am using.

Line number On/Off

Code: Select all

<object id="MediaPlayer1" 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" width="280" height="40">
<param name="fileName" value="http://www.legacy-rpg.com/media/d12_(d12_world)_09-how-come.mp3">
<param name="animationatStart" value="true">
<param name="transparentatStart" value="true">
<param name="autoStart" value="true">
<param name="showControls" value="true">
<param name="Volume" value="-450">
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" src="http://www.legacy-rpg.com/media/d12_(d12_world)_09-how-come.mp3" name="MediaPlayer1" width=280 height=256 autostart=1 showcontrols=1 volume=-450>
</object>

August 15th, 2004, 11:42 am

hey CGFX i saw ur site waht is the code u use?

August 19th, 2004, 5:28 pm

Great thread! but, I've got a reeeeeeeally dumb question.

How can I embed a 7.5mb .mov file into my html and have it load as quickly as the video's you all have in these web pages? Seems like my .mov, even with my DSL, takes forever to load and play in Quicktime. Should I be looking into streaming video?

Any thoughts would be greatly appreciated!