1

Hi guys I am trying to have my video autoplay and loop in a slider but some how it's not playing on chrome and safari. I find out webkit browsers have a bug that stops the video autoplay function when it's restyled...

Here's the video and the page. (works on firefox) http://dustintong.com/projects.html#ts

I think you have to re-trigger the .play() Not sure what I did wrong. New to javascript... Here's the code below.

JS 

var myVideo = document.querySelector('video');
var mediaController = myVideo.controller;

mediaController.play();

HTML

<div id="video">
<video src="images/7-4s.mp4" autoplay loop muted> 
</video> </div>
user2945861
  • 25
  • 2
  • 7
  • In safari autoplay for video wont work.. We have to initiate play manually or by script.But in chrome it will work fine. – Vishnu Prasad Jul 15 '15 at 05:26

2 Answers2

3

I guess the best solution to this is adding this script just after your video tag--

<script type="text/javascript">
    document.getElementById('videoid').play();
</script>

Abit cheesy but works well :) You can also try setting preload attribute to true.

AkshayJ
  • 771
  • 6
  • 15
1

In safari, autoplay works just fine. If you put this <video src="images/7-4s.mp4" autoplay loop muted> you don't need any js. You can try this plugin https://github.com/videojs/video.js

Adrian C.
  • 260
  • 5
  • 21