Technical notes index

EMBEDDING A QUICKTIME MOVIE INTO A WEB PAGE


Note that this will not work in current browsers on some computers, specifically Macs: the HTML5 video player is now expected. This is a basic example of the code for that:

<video controls="controls" height="16" width="400" src="URL">Your user agent does not support the HTML5 Video element.</video>

It's preferable to use the HTML5 player but if you want to use the QuickTime player the process is outlined below:

METHOD 1

Insert the following HTML code in your page:  replace the width and height in pixels in both the object and embed tags (indicated in purple below) to match your movie's dimensions. Remember to add 15 pixels to the height if you are including a controller. Also change the value of the "param src" to reflect the URL of your uploaded movie (indicated in red below). Put the same URL in the src section of the embed tag (indicated in green below). This code will allow both Windows and Macintosh users with Quicktime to view the video. However Windows will bring up a dialog box asking for confirmation.

<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
WIDTH="XXX" HEIGHT="XXX" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM name="SRC" VALUE="URL">
<PARAM name="AUTOPLAY" VALUE="false">
<PARAM name="CONTROLLER" VALUE="true">
<EMBED SRC="URL"
WIDTH="XXX" HEIGHT="XXX" AUTOPLAY="false" CONTROLLER="true"
PLUGINSPAGE="http://www.apple.com/quicktime/download/">
</EMBED>
</OBJECT>

By setting autoplay to true you can have the movie play as soon as the page loads, in which case you could dispense with the controller (so CONTROLLER="false"): if you do this you obviously do not need to increase the height by 15px. However I would think it preferable to have the controller and no autoplay.



METHOD 2

To get round Windows bringing up a dialog, follow this procedure.

Copy the following into a plain text file, amending the size and the URL (in both places) as above (note that there are no returns in the lines following each 'document.write'):

document.write('<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="XXX" height="XXX" codebase="http://www.apple.com/qtactivex/qtplugin.cab">')
document.write('<param name=SRC value="URL"> ')
document.write('<param name="AUTOPLAY" value="false"> <param name="CONTROLLER" value="true">')
document.write('<embed src="URL" width="XXX" height="XXX" autoplay="false" controller="true" pluginspage="http://www.apple.com/quicktime/download/"></embed></object>')

Save the text file as moviename.js (no '.txt' on the end) and upload it to somewhere suitable.

Now write the following into your web page at the point where you want the movie:

<SCRIPT LANGUAGE="JAVASCRIPT1.2" src="URL">

where URL is the address for moviename.js

This page shows a method for making a pop-up MP3 player in a new small window: the same technique can be used to make a pop-up video player, substituting the code above for the code used to make the audio player.

© Roger Wilmut