Reputation: 4577
I'm just making video on my site HTML5 compliant for portable iOS devices and one thing I'm running into is that I would like to have the client browser try the Flash player first because it's more customizable and if Flash is unavailable, try HTML5.
I had thought that maybe the order in the video tag would do it but it always goes to HTML5 regardless of the order of the tags.
For example:
<video width="640" height="360" controls>
<object width="640" height="360"><embed src="flashplayer.swf?movie=movie.mp4" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="360"></embed></object>
<source src="/video/ogg/movie.ogg" type="video/ogg">
<source src="/video/mp4/movie.mp4" type="video/mp4">
</video>
Any help would be appreciated, thanks.
Upvotes: 1
Views: 3052
Reputation: 3714
To do it without Javascript, I think you could put the <video>
tag inside the <object>/<embed>
to act as fallback if the browser cannot execute the object, i.e. the Flash player plugin is not available:
<object width="640" height="360">
<embed src="flashplayer.swf?movie=movie.mp4" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="360">
<video width="640" height="360" controls>
<source src="/video/ogg/movie.ogg" type="video/ogg">
<source src="/video/mp4/movie.mp4" type="video/mp4">
</video>
</embed>
</object>
Note that you can do it with a pure <object>
tag, no need for <embed>
in most modern browsers, AFAIK.
Upvotes: 2
Reputation: 2635
You could try the HTML 5 video player widget that that is based on the Kaltura open source library. It will let you customize both the HTML 5 as well as the Flash video player.
Upvotes: 1
Reputation: 6127
You can use SwfObject to detect Flash, and put the video element in the div that SwfObject replaces if Flash is available.
Upvotes: 5