HTML | DOM Video mediaGroup Property
The Video mediaGroup property is used for setting or returning the name of the media group the video is a part of.
Two or more <video> elements can be synchronized together using a media group.
The Video mediaGroup property returns a string which represents the media group of the video.
Syntax:
- Returning the mediaGroup property:
videoObject.mediaGroup
- Setting the mediaGroup property:
videoObject.mediaGroup = group
Property Values:
- group: It is used to specify the media group of the video.
Below program illustrates the Video mediaGroup property :
Example: Setting the video to loop.
<!DOCTYPE html> < html > < head > < title > HTML | DOM Video mediaGroup Property </ title > < style > h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </ style > </ head > < body > < h1 >GeeksforGeeks</ h1 > < h2 >Video mediaGroup Property</ h2 > < br > < video id = "Test_Video1" width = "360" height = "240" controls> < source src = "samplevideo.mp4" type = "video/mp4" > < source src = "movie.ogg" type = "video/ogg" > </ video > < video id = "Test_Video2" width = "360" height = "240" controls> < source src = "sample2.mp4" type = "video/mp4" > < source src = "movie.ogg" type = "video/ogg" > </ video > < p > For setting the media group on the videos, double click the "Set mediaGroup" button. </ p > < p > For returning the mediaGroup of the video, double click the "Return mediaGroup" button. </ p > < button ondblclick = "set()" type = "button" > Set mediaGroup </ button > < button ondblclick = "get()" type = "button" > Return mediaGroup </ button > < script > var v1 = document.getElementById( "Test_Video1"); var v2 = document.getElementById( "Test_Video2"); function set() { v1.mediaGroup = "Heap Sort"; v2.mediaGroup = "Quick Sort"; } function get() { alert("Media group of Video 1 is : " + v1.mediaGroup + ". Media group of Video 2 is : " + v2.mediaGroup); } </ script > </ body > </ html > |
Output:
- Before clicking the Set mediaGroup button:
- After clicking the Set mediaGroup button:
Supported Browsers: The browser supported by HTML | DOM Video mediaGroup Propertyare listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Apple Safari