HTML DOM onplay Event

The DOM onplay event occurs when the audio/video is played. The audio/video can be played either by the user or programmatically.

Supported Tags

Syntax:

In HTML:

<element onplay="myScript">

In JavaScript:

object.onplay = function(){myScript};

In JavaScript, using the addEventListener() method:

object.addEventListener("play", myScript);

Example: Using the addEventListener() method

HTML

<!DOCTYPE html>
<html>
  
<head>
    <title>
        HTML DOM onplay Event
    </title>
</head>

<body>
    <h1 style="color:green">
        GeeksforGeks
    </h1>
    <h2>HTML DOM onplay Event</h2>
    <video controls id="vidID" 
           width="320" height="240">
        <source src=
"https://media.geeksforgeeks.org/wp-content/uploads/20190401140735/g4g2.mp4" 
                type="video/mp4">
    </video>
  
    <script>
        document.getElementById(
            "vidID").addEventListener("play", GFGfun);
        function GFGfun() {
            alert("Video play");
        }
    </script>
</body>

</html>

Output:

Supported Browsers: The browsers supported by HTML DOM onplay Event are listed below:

Google Chrome 3
Edge 12
Internet Explorer 9.0
Firefox 3.5
Apple Safari 3.1
Opera 10.5

Explore