HTML Reference Manual

HTML Tag Directory

HTML Audio/Video DOM controls attribute

The controls attribute is responsible for controlling the display of the controls of the controls HTML attribute, which is responsible for controlling whether the control bar of the played media (video or audio) is displayed.

　HTML Audio/Video DOM Reference Manual

Online Example

Enable video controls:

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML Audio/Video controls attribute usage-Basic Tutorial(oldtoolbag.com)</<title>
</<head>
<body>
<button onclick="enableControls()" type="button">Enable controls</button>
<button onclick="disableControls()" type="button">Disable controls</button>
<button onclick="checkControls()" type="button">Check control status</button>
<br>　
<video id="video1">
　　<source src="movie.mp4" type="video/mp4">
　　<source src="movie.ogg" type="video/ogg">
　　Your browser does not support HTML5　video tag.
</video>
<script>
myVid = document.getElementById("video"1");
function enableControls()
{　
　　myVid.controls = true;
　　myVid.load();
}　
function disableControls()
{　
　　myVid.controls = false;
　　myVid.load();
}　
function checkControls()
{　
　　alert(myVid.controls);
}　
</script>　
</body>
</html>

Test and see ‹/›

Definition and Usage

The controls control property sets or returns whether the browser should display standard audio/Video controls.

Standard audio/Video controls include:

Play
Pause
Progress Bar
Volume
Fullscreen Toggle (for video)
Subtitle (when available)
Track (when available)

Browser Compatibility

IEFirefoxOperaChromeSafari

All major browsers support the controls attribute.

Note:Internet Explorer 8 and earlier versions do not support this attribute.

Syntax

Set controls attribute:

audio|video.controls=true|false

Return controls attribute:

audio|video.controls

Attribute value

Value	Description
true	Indicates that the control should be displayed.
false	Default. Indicates that the control should not be displayed.

Technical Details

Return value:	Boolean value, true\|false
Default value:	false

　HTML Audio/Video DOM Reference Manual

HTML: <template> tag