Question

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>

Answer 1

Maybe a long shot but have you tried adding:

AddType video/ogg .ogv
AddType video/mp4 .mp4

to your .htaccess file?

Also, here is a nice article with more tips to get you going: http://camendesign.com/