CODEWITHSUNDEEP
javascripthtml
Vladimir Mujakovic
Vladimir Mujakovic

Reputation: 680

HTML video will not play in Microsoft EDGE

I have the following video in my site. This is set as a fixed background at the top of the page, comprising the main banner. This element plays fine in every browser except EDGE.

I even tried writing a custom javascript snippet to force it to play (called with a button). This works when tested on Chrome but will not work on EDGE.

var vid = document.querySelector('#bgvid');

function playVideo() {
    console.log('trying to play!')
    vid.play();
};
<video poster="http://cranneyhomeservices.com/wp-content/uploads/2017/05/HS_Loop_Frame.png" id="bgvid" playsinline autoplay muted loop>
  <source src="http://cranneyhomeservices.com/Cranney-website.mp4" type="video/mp4" media="all and (max-width:414px)">
</video>

Upvotes: 1

Views: 2854

Answers (1)

messerbill
messerbill

Reputation: 5629

According to my comment you should use getElementById() instead of querySelector(). This should be correctly interpreted by chrome and edge.

Edit:

After testing your fiddle in my Edge it is an security issue. The problem was already discussed on SO:

HTTPS security is compromised error. How to fix?

Make sure that you do not load any content from a non secure source (i.e. https instead of http)

Upvotes: 1

Related Questions