Latest web development tutorials

HTML Audio / Video DOM timeupdate event

HTML audio / video Tag Reference HTML Audio / Video DOM Reference

Examples

When the video playback position has changed, it displays the current video playback position (one second count):

// Get id = "myVideo" the <video> element
var vid = document.getElementById ( "myVideo");

// Add ontimeupdate event <video> element, if the current playback position change function is executed
vid.ontimeupdate = function () {myFunction ()};

function myFunction () {
// Display id = "demo" of <p> elements in the video playback position
. Document.getElementById ( "demo") innerHTML = vid.currentTime;
}

try it"

Bottom of this article contains more examples.

Definition and Usage

Timeupdate trigger event in the audio / video (audio / video) playback position is changed.

This event can be invoked in the following circumstances:

  • Play audio / video (audio / video)
  • Mobile audio / video (audio / video) playback position

Tip: timeupdate event usually associated with Audio / Video object currentTime use with property, which returns the audio / video (audio / video) playback position (in seconds).

Browser Support

Figures in the table represent the first browser to support this version of events.

event
timeupdate Yes 9.0 Yes Yes Yes

grammar

In HTML:

<Audio | video ontimeupdate = "myScript "> try

In JavaScript:

audio | video .ontimeupdate = function () {myScript}; try

JavaScript, use the addEventListener () method:

audio | video .addEventListener ( "timeupdate" , myScript); try

Note: Internet Explorer 8 and earlier versions of IE do not support addEventListener () method.

technical details
Supported HTML tags: <Audio> and <video>
Supported JavaScript Objects: Audio, Video

Examples

More examples

Examples

When the audio playback position is changed, the display of the current audio playback position (in seconds):

// Get id = "myVideo" the <audio> element
var aud = document.getElementById ( "myVideo");

// Add ontimeupdate event <audio> element and perform the function when changing the playback position
aud.ontimeupdate = function () {myFunction ()};

function myFunction () {
// Display id = "demo" of the <p> element in the audio playback position
. Document.getElementById ( "demo") innerHTML = aud.currentTime;
}

try it"

Examples

Use currentTime property is set to 5 seconds the playback position:

document.getElementById ( "myVideo") currentTime = 5.;

try it"

HTML audio / video Tag Reference HTML Audio / Video DOM Reference