Javascript DOM HTML Video controls Property set

Introduction

Enable controls for a video: 

document.getElementById("myVideo").controls = true;

Click the button to add video controls.

View in separate window 

<!DOCTYPE html>
<html>
<body>

<video id="myVideo" width="100" height="100">
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>/*from   w  ww  .j  av a 2  s  .com*/
<button onclick="myFunction()">Test</button>

<script>
function myFunction() {
  document.getElementById("myVideo").controls = true;
}
</script>

</body>
</html>

The controls property sets or gets whether a video should display standard video controls.

This property mirrors the <video> controls attribute.

When present, it specifies that the video controls should be displayed.

Property Values

Value Description
true Indicates that controls are displayed
false Default. Indicates that controls are NOT displayed

The controls property returns true if video controls are displayed, otherwise it returns false.




PreviousNext

Related