HTML DOM Video autoplay Property

The HTML DOM Video autoplay property returns/sets boolean value corresponding to whether the video will play automatically on page load or not.

Syntax

Following is the syntax −

Returning boolean value - true/false

mediaObject.autoplay

Setting autoplay to booleanValue

mediaObject.autoplay = booleanValue

Here, “boolean value” can be the following −

booleanValue	Details
true	It defines that video will automatically play onpage load
false	It defines that video will not automatically playon page load

Let us see an example of Video autoplay property −

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML DOM Video autoplay</title>
<style>
   * {
      padding: 2px;
      margin:5px;
   }
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
   <form>
      <fieldset>
         <legend>HTML-DOM-Video-autoplay</legend>
         <video id="demo" width="320" controls><source                src="https://www.tutorialspoint.com/html5/foo.mp4" type="video/mp4"></video><br>
         <input type="button" onclick="getTrackDetails()" value="Disable Autoplay">
         <div id="divDisplay"></div>
      </fieldset>
   </form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var demo = document.getElementById("demo");
   demo.autoplay = true;
   divDisplay.textContent = 'Autoplay: '+demo.autoplay;
   function getTrackDetails() {
      demo.autoplay = false;
      demo.load();
      divDisplay.textContent = 'Autoplay: '+demo.autoplay;
   }
</script>
</body>
</html>

Output

Before clicking ‘Disable Autoplay’ button −

HTML DOM Video autoplay Property

After clicking ‘Disable Autoplay’ button −

HTML DOM Video autoplay Property