Video-JS autoplay attribute is not working

Viewed 6094

I have an HTML video tag with video-JS (version 5.20.5) and this is my code:

<video id="my-video" class="video-js" controls="" autoplay="true" preload="auto" style="width:1006px;height:562px;" >
    <source id="mysource" src="{$movie}" type='video/mp4' controls='false' />
    <p class="vjs-no-js">
        To view this video please enable JavaScript, and consider upgrading to a web browser that
        <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
</video>

I need to force it to autoplay but am not being too much lucky. I tried autoplay="true"; autoplay="" and autoplay="autoplay".

No one of these worked.

I even tried only autoplay but since I am using it into a XML package it will crash my page with the error:

The expected token is '='

Any idea?

EDIT: I already had implemented before the "half-assed solution" using the muted attribute but I thought that it didn't deserved the mention. In any case this is the code added right after the code above if someone is interested:

<script>
options = {
autoplay: true,
muted: true
video = videojs('my-video', options);
</script>
1 Answers

You may have to use the muted in combination with the autoplay property to get it to autoplay, depending on the browser. Otherwise you should use JS/JQuery.

Here's an example:

<video id="my-video" class="video-js" controls="" autoplay="true" preload="auto" style="width:1006px;height:562px;" >
    <source id="mysource" src="{$movie}" type='video/mp4' controls='false' />
    <p class="vjs-no-js">
        To view this video please enable JavaScript, and consider upgrading to a web browser that
        <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
</video>

<script>
document.getElementById('my-video').play();
</script>
Related