Home > Web Front-end > H5 Tutorial > Questions about the ontimeupdate event of the HTML5 Video object (invalid on Chrome) _html5 tutorial tips

Questions about the ontimeupdate event of the HTML5 Video object (invalid on Chrome) _html5 tutorial tips

WBOY
Release: 2016-05-16 15:49:07
Original
1935 people have browsed it

Date is making a video playback page, which uses the HTML5 Video object. This is a new object in HTML5. It supports online playback of videos in multiple different formats. It is relatively powerful and has expanded many events. You can pass JavaScript script to control video playback. Refer to the following two links:
http://msdn.microsoft.com/en-us/library/windows/apps/hh465962.aspx
http://www.w3school.com.cn/html5/tag_video .asp

The Video object can report the current playback progress through the ontimeupdate event. At the same time, this event can also be used to control other elements on the page based on the video playback situation, such as switching chapters as the video playback progresses. , display additional information, etc. Here is an example:

Copy the code
The code is as follows:











Time: 0 of 0 seconds.




For example:




Copy code
The code is as follows: video.ontimeupdate = function () { getCurrentVideoPosition(); };
However, the above line of code seems to be invalid on Chrome. You can use addEventListener to replace it:




Copy code
The code is as follows: videoPlayer.addEventListener("timeupdate", function () { getCurrentVideoPosition(); }, false);
I don’t know why the ontimeupdate event cannot be directly hung on the Video element on Chrome, but the event must be added through the addEventListener method. However, addEventListener is also compatible with IE and Firefox browsers, so it should pass.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template