Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
HTML Articles
Page 7 of 151
HTML DOM Video width Property
The HTML DOM Video width property returns/sets a number corresponding to width (in pixels) of media.SyntaxFollowing is the syntax −Returning width as a number (px)mediaObject.widthSetting width to a number (px)mediaObject.width = numberLet us see an example of Video width property −Example HTML DOM Video width * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } HTML-DOM-Video-width var divDisplay = document.getElementById("divDisplay"); var demo = document.getElementById("demo"); function getTrackDetails() { demo.width += 50; divDisplay.textContent = 'Video width: '+demo.width; } OutputBefore clicking ‘Video Not Visible’ button −Clicking ‘Video Not Visible’ button 3 times −
Read MoreHTML DOM TransitionEvent Object
The HTML DOM TransitionEvent Object represents an event which incurs on a transition.Here, “TransitionEvent” can have the following properties and methods −Property/MethodDescriptionpropertyNameItreturns returns astring corresponding to a CSS property used for transition when atransition event is triggeredelapsedTimeItreturns a numbercorresponding to how many seconds a transition had run when atransition event is triggeredpseudoElementItreturns a nameof the pseudo-element of the transitionLet us see an example of TransitionEvent elapsedTime property −Example TransitionEvent elapsedTime form { width:70%; margin: 0 auto; text-align: center; } * { padding: ...
Read MoreHTML DOM Event type Property
The HTML DOM Event type property returns a string corresponding to the event’s type such as click, keypress, load, or touchend.Following is the syntax −Returning number of seconds a transition has run −event.typeLet us see an example of Event type property −Example HTML DOM Event type form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } .playArea { display: ...
Read MoreHTML DOM UiEvent detail Property
The HTML DOM UiEvent detail property returns a number corresponding to clicks triggered continuously.NOTE − If ondblclick event is triggered returned value is ‘2’, and always ‘0’ if onmouseover or onmouseout event is triggered.SyntaxFollowing is the syntax −Returning number of clicks triggered continuously −event.detailLet us see an example of Event detail property −Example HTML DOM UiEvent detail form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { ...
Read MoreHTML DOM Video autoplay Property
The HTML DOM Video autoplay property returns/sets boolean value corresponding to whether the video will play automatically on page load or not.SyntaxFollowing is the syntax −Returning boolean value - true/falsemediaObject.autoplaySetting autoplay to booleanValuemediaObject.autoplay = booleanValueHere, “boolean value” can be the following −booleanValueDetailstrueIt defines that video will automatically play onpage loadfalseIt defines that video will not automatically playon page loadLet us see an example of Video autoplay property −Example HTML DOM Video autoplay * { padding: 2px; margin:5px; } form { width:70%; margin: ...
Read MoreHTML DOM Video canPlayType( ) Method
The HTML DOM Video canPlayType() returns a string corresponding to whether the browser can play the specified video type or not.SyntaxFollowing is the syntax −Returning boolean value - true/falsevideoObject.canPlayType(typeAsParameter)Here, the return value can be the following −returnValueDetailsprobablyIt defines that browser mostlikely supports the specified video typemaybeIt defines that browsermight support the specified video type, but playback will have tobe attempted to be sure"" (empty string)It defines that browserdefinitely doesn’t supports the specified video typeLet us see an example of Video canPlayType() property −Example HTML DOM Video canPlayType() * { padding: 2px; ...
Read MoreHTML DOM Video textTracks Property
The HTML DOM Video textTracks property returns a TextTrackList object containing information about the text tracks for the video.SyntaxFollowing is the syntax −Returning TextTracksList ObjectmediaObject.textTracksLet us see an example of Video textTracks property −Example HTML DOM Video textTracks * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } HTML-DOM-Video-textTracks ...
Read MoreHTML DOM Video volume Property
The HTML DOM Video volume property returns/sets a number corresponding to current volume level of media.SyntaxFollowing is the syntax −Returning volume as a numbermediaObject.volumeSetting volume to a numbermediaObject.volume = numberNOTE: Number has a max value of ’1.0’ and if ‘0.0’ video volume is min.Let us see an example of Video volume property −Example HTML DOM Video volume * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { ...
Read MoreHTML DOM localStorage Properties
The HTML DOM localStorage Properties enables user to store key-value pairs in local browser itself for future reference. Key-value pairs are not lost until explicitly removed/cleared.SyntaxFollowing is the syntax −Window.localStorageHere, localStorage can have following properties/methods −setItem(‘key’, ’value’)getItem(‘key’)removeItem(‘key’)Let us see an example of localStorage properties −Example LocalStorage clear() form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } table, th, td { ...
Read MoreHTML DOM Input Datetime form Property
The HTML DOM Input Datetime form property returns the reference of enclosing form for input datetime.SyntaxFollowing is the syntax −Returning reference to the form objectinputDatetimeObject.formExampleLet us see an example of Input Datetime form property − Input Datetime form Date & Time: Get Form ID function getFormID() { var inputDatetime = document.getElementById("Datetime"); var divDisplay = document.getElementById("divDisplay"); divDisplay.textContent = 'Form ID for datetime input: '+inputDatetime.form.id; } OutputThis will produce the following output −Before clicking ‘Get Form ID’ button −After checking ‘Get Form ID’ button −
Read More