How to embed a .mov file in HTML?

Asked 20/9, 2012 at 22:30 Answered 25/9, 2013 at 0:33

What's the correct way of adding a .mov file to a webpage?

I'm just adding this functionality to an existing file so I can't convert it to HTML5. The file is on the same server about 1G in size.

The client also doesn't want to use YouTube or Vimeo as it's on the homepage.

Plumbic answered 20/9, 2012 at 22:30 Comment(1)

by the way... HTML5 is not a format of media file and it is not possible to convert whatever file to HTML5. HTML5 is a specification of HTML, it defines standards that should be used in order to make pages compatible for all browsers – Panelist 20/9, 2012 at 23:21

Had issues using the code in the answer provided by @haynar above (wouldn't play on Chrome), and it seems that one of the more modern ways to ensure it plays is to use the video tag

Example:

<video controls="controls" width="800" height="600" name="Video Name">
  <source src="http://www.myserver.com/myvideo.mov">
</video>

This worked like a champ for my .mov file (generated from Keynote) in both Safari and Chrome, and is listed as supported in most modern browsers (The video tag is supported in Internet Explorer 9+, Firefox, Opera, Chrome, and Safari.)

Note: Will work in IE / etc.. if you use MP4 (Mov is not officially supported by those guys)

Guillerminaguillermo answered 25/9, 2013 at 0:33 Comment(1)

surprisingly simple. I'm shocked this worked. Thank you! – Introspect 14/9, 2017 at 13:37

<object CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="320" height="256" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
    <param name="src" value="sample.mov">
    <param name="qtsrc" value="rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov">
    <param name="autoplay" value="true">
    <param name="loop" value="false">
    <param name="controller" value="true">
    <embed src="sample.mov" qtsrc="rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov" width="320" height="256" autoplay="true" loop="false" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>
</object>

source is the first search result of the Google

Panelist answered 20/9, 2012 at 23:16 Comment(1)

thought you might be interested in reading this. – Ardeth 21/9, 2012 at 2:49

Well, if you don't want to do the work yourself (object elements aren't really all that hard), you could always use Mike Alsup's Media plugin: http://jquery.malsup.com/media/

Eucharist answered 20/9, 2012 at 23:17 Comment(0)

Recommended topics

Hot tags