Solved

How to embed mp4 video in web page

Posted on 2013-10-22
5
451 Views
Last Modified: 2013-10-22
I have an mp4 video and I would like to play it automatically on my web page. What code do I need in my html? Thanks for your help.
0
Comment
Question by:romsom
  • 3
  • 2
5 Comments
 
LVL 14

Expert Comment

by:Giovanni Heward
ID: 39592600
<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  <object data="movie.mp4" width="320" height="240">
    <embed src="movie.swf" width="320" height="240">
  </object>
</video> 

Open in new window

0
 

Author Comment

by:romsom
ID: 39592632
Unfortunately it is not working when I place the code in my html.
The video is in the same folder, and I can play it by right clicking it and selecting play. It is called SFO.mp4 so I customized the code above like this
<video width="320" height="240" controls>
  <source src="SFO.mp4" type="video/mp4">
  <source src="SFO.ogg" type="video/ogg">
  <object data="SFO.mp4" width="320" height="240">
    <embed src="SFO.swf" width="320" height="240">
  </object>
</video>

Open in new window

When I open my page an alert pops up saying "An ActiveX control on this page might be unsafe to interact with other parts of the page. Do you want to allow this interaction?" If I click yes, a media player window pops up and the following error message is displayed: Windows Media Player cannot find the file. If you are trying to play, burn, or sync an item that is in your library, the item might point to a file that has been moved, renamed, or deleted.
I wonder why this happens.
0
 
LVL 14

Expert Comment

by:Giovanni Heward
ID: 39592698
The other extensions were provided as an example, in an HTML5 compliant browser, try...

<video width="320" height="240" controls>
  <source src="SFO.mp4" type="video/mp4">
  <object data="SFO.mp4" width="320" height="240">
    <embed src="SFO.mp4" width="320" height="240">
  </object>
</video>
0
 
LVL 14

Accepted Solution

by:
Giovanni Heward earned 500 total points
ID: 39592707
If that fails you could try an embedded video player, such as

http://www.longtailvideo.com/jw-player/download/
http://www.videojs.com/

etc.

This site has a product which will create the code for you.

http://easyhtml5video.com/
0
 

Author Closing Comment

by:romsom
ID: 39592731
It is working fine when I play it on my computer, but when I upload it to the server I get the ActiveX message described above. Thank you for the links, I will use them.
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question