Videoplayer"

From Documentation
(Created page with "= Videoplayer = *Java API: <javadoc>org.zkoss.zkmax.zul.Videoplayer</javadoc> *JavaScript API: <javadoc directory="jsdoc">zkmax.med.Videoplayer</javadoc> = Employment/Purpose =...")
 
Line 40: Line 40:
  
 
== currentTime ==
 
== currentTime ==
 +
 +
<source lang="xml" >
 +
<videoplayer src="zk.mp4" currentTime="60" />
 +
</source>
  
 
== paused ==
 
== paused ==
 +
 +
<source lang="xml" >
 +
<videoplayer src="zk.mp4" paused="true" />
 +
</source>
  
 
== volume ==
 
== volume ==
 +
 +
<source lang="xml" >
 +
<videoplayer src="zk.mp4" volume="0.5" />
 +
</source>
  
 
= Supported Events =
 
= Supported Events =

Revision as of 10:44, 13 April 2018

Videoplayer

Employment/Purpose

An videoplayer 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

Player-Sample.png

 <videoplayer src="zk.mp4" controls="true" autoplay="true" loop="true" />

Supports HTML5

The videoplayer 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:

 <videoplayer src="zk.mp4, zk.webm, zk.ogg" />

enableFullScreen

The videoplayer component provides a client-side method enableFullScreen() to use full screen mode.

 <videoplayer id="player" src="zk.mp4" />
 <button xmlns:w="client" w:onClick="zk.$('$player').enableFullScreen()" />

Properties

turnOffLight

The videoplayer component provides theater mode, If turnOffLight="true", the whole page will cover by translucent black except <videoplayer>.

Player-turnOffLight.png

 <videoplayer src="zk.mp4" turnOffLight="true" />

currentTime

 <videoplayer src="zk.mp4" currentTime="60" />

paused

 <videoplayer src="zk.mp4" paused="true" />

volume

 <videoplayer src="zk.mp4" volume="0.5" />

Supported Events

Name
Event Type
None None

Supported Children

*NONE

Use Cases

Version Description Example Location