HTML5 video controls not working in Internet Explorer - javascript

I'm having a little trouble with IE11 (and 10 and 9, when simulated through IE11's f12->Emulation menu) in that the controls for HTML5 videos are not working. The video displays, and if autoplay is enabled will even play, but it will not respond to play/pause, seek, fullscreen etc.
The page works fine in the latest chrome, safari, firefox browsers, just not IE.
Anyone able to help me? Link to live site is http://bslhomework.org.uk/christmas
Thanks in advance

http://bslhomework.org.uk/christmas is unreachable (file not found).
http://bslhomework.org.uk/
is redirecting to [http]://127[dot]0[dot]0[dot]1 (bad)
do you still need help?

Related

Autoplaying Video element from Javascript does not work on iOS Safari

I'm trying to get video stream from phone camera and display the stream on a video element. This is the gist of the code I have:
...
navigator.mediaDevices.getUserMedia(constraints)
.then((stream)=>{
video.srcObject=stream;
video.volume=0;
video.mute=0;
video.play(); //error here on iOS Safari
...
While this works on all desktop and android browsers, this does not seem to work on iOS, giving me the error on line video.play().
From what I understand so far, this seems to be a safety measure by Safari on mobile to prevent websites from consuming too much of user's data. Meaning, unless specifically initiated by the user, the browser won't allow video.play()
I have tried adding "muted" attribute on the video element itself (besides just autoplay), but that did not seem to fix the issue.
So, I'd like to know if there are any other remedies to the issue here or if I should look for alternative ways to show the video feed. Any help/suggestions are greatly appreciated.
Have you tried adding playsinline to the video element?
https://webkit.org/blog/6784/new-video-policies-for-ios/

getUserMedia stopped working on Safari 10, no support

Since the release of Safari 10 the method getUserMedia() has stopped working in order to access the video camera from the browser. I haven't found any alternative apart from Flash, but also Flash is deactivated by default in Safari 10 which makes it a bad solution.
Have you found a fix for this issue?
You can try the standard html getUserMedia from the demos section of this website and test how in Safari stops working https://webrtc.github.io/samples/
Thanks.

Embedded Youtube video doesn't work on firefox

Here's My Fiddle.
I currently have an animation,where at the end of it,i have a video.
It works fine on chrome,but not on firefox.
My version is 26.0 ,Mozilla firefox.
This is the part where i show the video iframe.
function showIframe() {
$("#container").addClass("hideContainer");
$("#livingRoomBG").append("<iframe id='video' src='https://www.youtube.com/embed/BIz02qY5BRA?autoplay=1' frameborder='1' allowfullscreen=''></iframe>");
$("#livingRoomBG").addClass("showlivingRoomBG");
console.log("ola")
}
Can someone explain why this is happening?
PS:The audio does come though,cuz i have put it on autoplay..
the most likely cause to this is some kind of Firefox addon, have you tried opening it in safe mode?

YouTube API - video plays, but functions like playVideo and seekTo don't work in IE9

My site uses the YouTube API to embed a video, and relies on being able to use Javascript to play, pause, and seek through the video.
Currently, the site works in Chrome, Firefox, and IE10. However, I have problems in IE9.
In IE9, the video player correctly plays. However, the player object is somehow corrupted.
When the video is playing, player.getPlayerState() should return 1. When the video is paused, player.getPlayerState() should return 2. This is indeed correct in FF, Chrome, and IE10.
However, in IE9, player.getPlayerState() returns -1 regardless of whether it is playing or stopped. In addition player.playVideo() and player.pauseVideo() do not seem to do anything.
What's interesting is even in IE8, the player.getPlayerState(), player.playVideo(), player.pauseVideo() work fine. It's ONLY in IE9 that the problem exists.
I would appreciate any relevant information or ideas as to where to debug this problem. Thanks in advance!
EDIT: Just to update, I've tested this on a separate (friend's) machine, too.
============================
Here is an external link to the site in question, for visual reference.
http://tabless.net/tabs/50/t/Blink-182-All-The-Small-Things/
To test, just click the play button to toggle play/pause. Or you can use spacebar.

Why is IE9 telling me it does not support audio, but it supports other audio

I'm working on an audio player that works in Chrome, but won't load in IE9. When I use this code it says the browser does not support audio.
<script> var supportsAudio1 = !!document.createElement('audio').canPlayType;
alert(supportsAudio1);</script>
However, sites that also use this method of detecting audio capability say audio can play, and the audio on that site does work. Can anyone help me figure out why IE9 is doing this?
Thanks!
Internet Explorer only supports audio in IE9 mode. Make sure you have <!doctype html> at the beginning of your markup and you didn't press the Compatibility View button. javascript:alert(document.documentMode) can tell you which document mode is IE9 rendering the page in.

Categories