The VTTRegion interface—part of the API for handling WebVTT (text tracks on media presentations)—describes a portion of the video to render a VTTCue onto.
VTTRegion
Constructor
-
VTTRegion() -
Returns a newly created
VTTRegionobject.
Instance properties
-
VTTRegion.id -
A string that identifies the region.
-
VTTRegion.width -
A
doublerepresenting the width of the region, as a percentage of the video. -
VTTRegion.lines -
A
doublerepresenting the height of the region, in number of lines. -
VTTRegion.regionAnchorX -
A
doublerepresenting the region anchor X offset, as a percentage of the region. -
VTTRegion.regionAnchorY -
A
doublerepresenting the region anchor Y offset, as a percentage of the region. -
VTTRegion.viewportAnchorX -
A
doublerepresenting the viewport anchor X offset, as a percentage of the video. -
VTTRegion.viewportAnchorY -
A
doublerepresenting the viewport anchor Y offset, as a percentage of the video. -
VTTRegion.scroll -
An enum representing how adding new cues will move existing cues.
Examples
js
const region = new VTTRegion();
region.width = 50; // Use 50% of the video width
region.lines = 4; // Use 4 lines of height.
region.viewportAnchorX = 25; // Have the region start at 25% from the left.
const cue = new VTTCue(2, 3, "Cool text to be displayed");
cue.region = region; // This cue will be drawn only within this region.
Specifications
Browser compatibility
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
VTTRegion |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
VTTRegion |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
id |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
lines |
No | No | 59 | No | No | 12.1 | No | No | 59 | No | 12.2 | No |
regionAnchorX |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
regionAnchorY |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
scroll |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
viewportAnchorX |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
viewportAnchorY |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
width |
No | No | 59 | No | No | 7 | No | No | 59 | No | 7 | No |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/VTTRegion