Not able to show video with html5
- by shin
I am testing html 5 video tag.
I am using http://www.kaltura.org/project/HTML5_Video_Media_JavaScript_Library and http://camendesign.co.uk/.
I downloaded the creative common video.
When I use an external link, it plays the video. So I uploaded the video to my server but it does not play. It asks if I want to save it or asking an application to play.
When I go to the external link, http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb400p.ogv, it plays it on the browser automatically.
I also tested locally, but it does not play either.
I am hoping someone gives me why and how to solve the problem.
This code works.
<figure>
<video id="vid1" width="500" height="300" style="position:absolute"
poster="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb480.jpg"
durationHint="33"
controls = "true">
<source src="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb400p.ogv" />
<source src="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb_trailer_iphone.m4v"/>
</video>
</figure>
This does not.
<figure>
<video id="vid1" width="500" height="300" style="position:absolute"
poster="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb480.jpg"
durationHint="33"
controls = "true">
<source src="http://www.mywebsite.com/media/bbb400p.ogv" />
<source src="http://www.mywebsite.com/media/bbb_trailer_iphone.m4v"/>
</video>
</figure>
This does not work either.
<figure>
<video id="vid1" width="500" height="300" style="position:absolute"
poster="http://cdn.kaltura.org/apis/html5lib/kplayer-examples/media/bbb480.jpg"
durationHint="33"
controls = "true">
<source src="http://127.0.0.1/html5videotest/media/bbb400p.ogv" />
<source src="http://127.0.0.1/html5videotest/media/bbb_trailer_iphone.m4v"/>
</video>
</figure>