Front End Technology Articles - Page 487 of 860

The HTML DOM UiEvent Object represents an event which incurs on user’s interaction with HTML elements.Here, “UiEvent” can have the following properties and methods −Property/MethodDescriptiondetailItreturns a number with details about the eventviewItreturns a reference to the Window object where the event occurredLet us see an example of Event detail property −Example Live Demo HTML DOM UiEvent detail    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: ... Read More

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 Live Demo HTML DOM UiEvent detail    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {     ... Read More

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 Live Demo HTML DOM Event type    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    .playArea {       ... Read More

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 Live Demo TransitionEvent elapsedTime    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       ... Read More

The HTML DOM TransitionEvent propertyName property returns a string corresponding to a CSS property used for transition when a transition event is triggered.Following is the syntax −Returning CSS property that transition has used −transitionEvent.propertyNameLet us see an example of TransitionEvent propertyName property −Example Live Demo TransitionEvent propertyName    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    #playArea {       display: ... Read More

The HTML DOM TransitionEvent elapsedTime property returns a number corresponding to how many seconds a transition had run when a transition event is triggered.Following is the syntax −Returning number of seconds a transition has run −transitionEvent.elapsedTimeLet us see an example of TransitionEvent elapsedTime property −Example Live Demo TransitionEvent elapsedTime    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    #playArea {     ... Read More

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 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 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 label property sets/returns the value of label attribute of track element to specify the visible text for track.Following is the syntax −Returning string valuetrackObject.labelSetting label to stringValuetrackObject.label = labelValueLet us see an example of Track label property −Example Track label    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }                    Track-label                                                                              var divDisplay = document.getElementById("divDisplay");    var trackSelect = document.getElementsByTagName("track");    function getTrackDetails() {       for(var i=0; i