Develop Reference

How can I redirect to a URL when browser dose not support HTML5 videos?

I am trying to redirect to a different URL when html5 video's not supporting. Actually HTML5 video are not playing in safari browser. So I want to redirect my page to home.html instead of index.html. Any help or direction My browser giving message Your browser does not support HTML5 video. Here is my code, any help will be appreciated.
index.html
<video id="myVideo" autoplay preload controls >
<source src="final.mp4" type="video/mp4">
<source src="final.ogv" type="video/ogg; codecs=theora, vorbis">
<source src="final.webm" type="video/webm; codecs=vp8, vorbis">
Your browser does not support HTML5 video.
</video>

You can check if the video element is supported in JavaScript, and then redirect if it isn't supported:
if (!document.createElement('video').canPlayType) {
window.location.replace('home.html');
}

HTML5 Video not rendering on Safari & Firefox with Angular.js

Im trying to display some static HTML5 video in my Angular app. It plays without issues in Chrome but not on Safari or Firefox.
<video class="masthead-video w100 m-w100" autoplay loop muted>
<source src="public/img/test.mp4" type="video/mp4">
<source src="public/img/test.webm" type="video/webm">
<source src="public/img/test.ogv" type="video/ogg">
Your browser does not support the video tag.
</video>
Loading this markup into a browser as simple HTML (no angular or any other markup) allows it to play on Safari and Firefox normally without issues.
Ive tried using ng-src instead (even though I shouldnt have to since Im not using dynamic paths) but it didnt help.
Does anyone know of any issues when using HTML5 video with Angular.js?

Use $sce for trust source url .
$scope.trustSrc = function (src) {
return $sce.trustAsResourceUrl(src);
};
$scope.src= public/img/test.mp4;
Html Content
<video class="masthead-video w100 m-w100" autoplay loop muted>
<source ng-src="{{trustSrc(src)}}" type="video/mp4">
Your browser does not support the video tag.
</video>
appy this way for your code.

html5 video autoplay doesn't work on iPhone

<video autobuffer controls autoplay>
<source id="mp4" src="../vid/coolvideo.mp4" type="video/mp4">
</video>
Is there anyway to autoplay a .mp4 video file on page load for iPhone and Android Smart Mobile Devices. The above works great in the browser, but struggles hard on smart mobile. Is there any other HTML5 or even If I must JS solutions for iPhone (without loading a bloated third-party resource, ideally). Plain javaScript or plain jQuery, HTML5 solutions ideal.

It works only if you add muted and playsinline attributes
<video autoplay playsinline muted loop>
<source src="cover.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>

Check this link
which says:"autoplay is disabled to prevent unsolicited cellular download"

how to add background music to a web page with audio toggle?

I am using bootstrap to build my website and I would like a little bit of flare added to it. I have read some stuff on here but couldn't find exactly what I want.
glyphicon-volume-up to right of the navbar-header.
music autoplay once site visited
volume default to 50%
switches between glyphicon-volume-off/glyphicon-volume-up (unmute and mute)

You should use the HTML audio tag
<audio controls autoplay>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio
You can try it here. Add the autoplay I have above when you go to the link and refresh.
Note: You can also use CSS to hide the audio player and write custom javascript to control the audio with your own buttons.

Embedding audio in IE(7+) with javascript capability to mute and unmute

I've been looking around for a method to embed audio onto a website, have a capability to loop and autoplay and also be able to mute and unmute the audio with javascript. I know that this is possible and very easy in html5, but I've heard that IE doesn't support html5 yet (or the audio tags perhaps).
I also need my embedded audio to work as far back as IE7. So i think that using the tags will work for all other browsers but IE, while I was hoping something like could work for IE; unfortunately, it doesn't support calls from javascript to mute and unmute - this is because I don't want any controls from the audio player to be visible; simply a custom sound button that the user can click to mute and unmute the audio. Any ideas? Seems that something like this is the most simple thing, but the hardest thing to code :/

Consider using a player that uses HTML 5 by default, but can fall back on Flash if it's not supported.
JPlayer can do that, and has a mute function.

HTML5 is your best bet.
<audio>
<source src="horse.ogg" type="audio/ogg" />
<source src="horse.mp3" type="audio/mp3" />
<!--
You can put a flash player here in case the users browser doesn't support HTML5 or any of the audio formats you have added.
-->
</audio>
the attributes you might want to specify in the audio tag are controls='controls' to enable playback options like play pause and volume controls including mute; loop='loop' to enable auto-loop; autoplay='autoplay' obviously to autoplay; and preload='auto' to load the audio on page load (you can also specify "metadata" or "none")
your player would probably look like:
<audio preload='auto' autoplay='autoplay' controls='controls' loop='loop'>
<source src="yoursound.ogg" type="audio/ogg" />
<source src="yoursound.mp3" type="audio/mp3" />
<!--
Flash player here to fall back on if the users browser doesn't support HTML5
-->
</audio>