Menu
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.
428
Add movie file using the img tag. Embed tag to play QuickTime movies (. MOV). Type attribute for embed tag to specify plug-in.
If you have a MOV video file, you can embed this file on your site using the HTML tag.
HTML allows playing video in the web browser by using <video> tag. To embed the video in the webpage, we use src element for mentioning the file address and width and height attributes are used to define its size. Example: In this example, we are using <video> tag to to add video into the web page.
Embedding an HTML file is simple. All we need to do is use the common „<link>“ element. Then we add the value „import“ to the „rel“ attribute.
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)
187
<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
42
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/
27
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
