Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
The HTML DOM Video played property returns a TimeRanges object containing information about the video’s played range length and its start, end position.SyntaxFollowing is the syntax −Returning TimeRanges ObjectmediaObject.playedLet us see an example of Video played property −ExampleLive Demo HTML DOM Video played * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } ... Read More
The HTML DOM Video poster property returns/sets a string corresponding to the url of an image shown until the video is played or network state is equal to ‘2’.SyntaxFollowing is the syntax −Returning string valuemediaObject.posterSetting poster to a URLStringmediaObject.poster = URLStringLet us see an example of HTML DOM Video poster property −ExampleLive Demo HTML DOM Video poster * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { ... Read More
The HTML DOM Video height property returns/sets a number corresponding to height (in pixels) of media.SyntaxFollowing is the syntax −Returning height as a number (px)mediaObject.heightSetting height to a number (px)mediaObject.height = numberLet us see an example of Video height property −ExampleLive Demo HTML DOM Video height * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } ... Read More
The HTML DOM TouchEvent touches property returns a TouchList object corresponding to a list of all contact points triggered on a touch surface.NOTE: If a touch is triggered on the specified node or any of its child nodes then the following touches will count even if they are not triggered on the same node.Following is the syntax −Returning TouchList objectevent.touchesNote: We ran Touch event examples on Online HTML Editors accessed on Mobile or systems with touch access. This is done so that we can perform touch operations like touch the screen for 2 seconds.Let us see an example of TouchEvent ... Read More
The HTML DOM Track Object in HTML represents the element.Creating a elementvar trackObject = document.createElement(“TRACK”)Here, “trackObject” can have the following properties −PropertyDescriptiondefaultItsets/returns the default state of a trackkindItsets/returns the value of the kind attribute of the tracklabelItsets/returns the value of the label attribute of the trackreadyStateItreturns the current state of the track resourcesrcItsets/returns the value of the src attribute of the tracksrclangItsets/returns the value of the srclang attribute of the tracktrackItreturns a TextTrack object representing the track element's texttrack dataLet us see an example of Track kind property −Example Live Demo Track kind form { ... Read More
The HTML DOM Track src property sets/returns the value of src attribute of track element to specify the URL for track.Following is the syntax −Returning string valuetrackObject.srcSetting src to stringValuetrackObject.src = URLLet us see an example of Track src property −ExampleLive Demo Track src form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } Track-src var divDisplay = document.getElementById("divDisplay"); var trackSelect = document.getElementsByTagName("track"); function getTrackDetails() { for(var i=0; i
The HTML DOM Track srclang property sets/returns a value corresponding to the language of text track.Following is the syntax −Returning string valuetrackObject.srclangSetting srclang to stringValuetrackObject.srclang = stringValueLet us see an example of Track srclang property −ExampleLive Demo Track srclang form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } Track-srclang var divDisplay = document.getElementById("divDisplay"); var trackSelect = document.getElementsByTagName("track"); function getTrackDetails() { for(var i=0; i
The HTML DOM Video controls property returns/sets boolean value corresponding to whether the video’s standard controls will be enabled or not.SyntaxFollowing is the syntax −Returning boolean value - true/falsemediaObject.controlsSetting controls to booleanValuemediaObject.controls = booleanValueHere, “booleanValue” can be the following −booleanValueDetailstrueIt defines that video willhave standard controlsfalseIt defines that video willnot have standard controlsLet us see an example of Video controls property −ExampleLive Demo HTML DOM Video controls * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; ... Read More
The HTML DOM Video currentTime property returns/sets the current position of seeker (in seconds) of media.Following is the syntax −Returning seeker positionmediaObject.currentTimeSetting currentTime to seekable positionmediaObject.currentTime = secondsLet us see an example of Video currentTime property −ExampleLive Demo HTML DOM Video currentTime * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } HTML-DOM-Video-currentTime var divDisplay = document.getElementById("divDisplay"); var demo = document.getElementById("demo"); function getTrackDetails() { demo.currentTime = '15'; divDisplay.textContent = 'Some Seconds Avoided'; } OutputBefore clicking ‘Jump some seconds’ button −After clicking ‘Jump some seconds’ button −
The HTML DOM Video defaultPlaybackRate property returns/sets a number corresponding to default playback rate of media.SyntaxFollowing is the syntax −Returning defaultPlaybackRate as a numbermediaObject.defaultPlaybackRateSetting defaultPlaybackRate to a numbermediaObject.defaultPlaybackRate = numberNOTE − Number has a max value of ‘16’ and if ‘0.0’ an error occurs.Let us see an example of Video defaultPlaybackRate property −ExampleLive Demo HTML DOM Video defaultPlaybackRate * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { ... Read More