Video"
Charlesqiu (talk | contribs) (→Video) |
Charlesqiu (talk | contribs) |
||
| Line 33: | Line 33: | ||
</source> | </source> | ||
| − | = | + | = dimBackground = |
| − | The video component provides theater mode, If | + | The video component provides theater mode, If dimBackground="true", the whole page will be covered by translucent black except the Video. |
When theater mode is enabled, user can click anywhere on the page except the Video to disable theater mode. | When theater mode is enabled, user can click anywhere on the page except the Video to disable theater mode. | ||
| Line 40: | Line 40: | ||
[[Image:Player-turnOffLight.png]] | [[Image:Player-turnOffLight.png]] | ||
<source lang="xml" > | <source lang="xml" > | ||
| − | <video src="zk.mp4" | + | <video src="zk.mp4" dimBackground="true" /> |
</source> | </source> | ||
Revision as of 09:18, 25 April 2018
Video
[ ZK EE ] [ since 8.5.2 ]
Employment/Purpose
An video component is used to play the video at the browser. Like audio, you could use the src property to specify an URL of an video resource, or the setContent method to specify a dynamically generated video. Developers might be able to control the play of an video by the play, stop and pause methods.
Example
<video src="zk.mp4" controls="true" autoplay="true" loop="true" />
Supports HTML5
The video component support HTML 5, like <video>, it includes the properties like autoplay, controls, loop, muted and preload.
Multiple Sources
Most browsers do not support all the video formats,so we could specify multiple source files in different formats for different browsers. For examples:
<video src="zk.mp4, zk.webm, zk.ogg" />
enableFullScreen
The video component provides a client-side method enableFullScreen() to use full screen mode.
<video id="player" src="zk.mp4" />
<button xmlns:w="client" w:onClick="zk.$('$player').enableFullScreen()" />
dimBackground
The video component provides theater mode, If dimBackground="true", the whole page will be covered by translucent black except the Video.
When theater mode is enabled, user can click anywhere on the page except the Video to disable theater mode.
<video src="zk.mp4" dimBackground="true" />
currentTime
The video provieds setCurrentTime(double) to decide which part of video to play, the value is seconds.
<video src="zk.mp4" currentTime="60" />
paused
The video provieds setPaused(boolean) to play or pause the video.
paused="false" is same as invoking play(), paused="true" is same as invoking pause().
<video src="zk.mp4" paused="true" />
volume
The video component provides setVolume(double) to change the volume, the valid value is between 0.0 to 1.0.
<video src="zk.mp4" volume="0.5" />
muted
The video component provides setMuted(boolean) to mute the video.
<video src="zk.mp4" muted="true" />
Supported Events
| None | None |
- Inherited Supported Events: XulElement
Supported Children
*NONE
Use Cases
| Version | Description | Example Location |
|---|---|---|