mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-28 10:31:20 -08:00
update docs
This commit is contained in:
1 parent
3f1e033152
commit
55ca351b60
119 files changed
+1882
-1882
No files matched your search
@@ -234,8 +234,10 @@ art.on('ready', () => {
|
||||
管理播放器的层
|
||||
|
||||
- `add` 方法用于动态添加层
|
||||
- `remove` 方法用于动态删除层
|
||||
- `update` 方法用于动态更新层
|
||||
- `show` 属性用于设置是否显示全部层
|
||||
- `toggle` 属性用于切换是否显示全部层
|
||||
- `toggle` 方法用于切换是否显示全部层
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
@@ -267,8 +269,10 @@ art.on('ready', () => {
|
||||
管理播放器的控制器
|
||||
|
||||
- `add` 方法用于动态添加控制器
|
||||
- `remove` 方法用于动态删除控制器
|
||||
- `update` 方法用于动态更新控制器
|
||||
- `show` 属性用于设置是否显示全部控制器
|
||||
- `toggle` 属性用于切换是否显示全部控制器
|
||||
- `toggle` 方法用于切换是否显示全部控制器
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
@@ -301,8 +305,10 @@ art.on('ready', () => {
|
||||
管理播放器的右键菜单
|
||||
|
||||
- `add` 方法用于动态添加菜单
|
||||
- `remove` 方法用于动态删除菜单
|
||||
- `update` 方法用于动态更新菜单
|
||||
- `show` 属性用于设置是否显示全部菜单
|
||||
- `toggle` 属性用于切换是否显示全部菜单
|
||||
- `toggle` 方法用于切换是否显示全部菜单
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
@@ -438,9 +444,10 @@ art.on('ready', () => {
|
||||
管理播放器的设置面板
|
||||
|
||||
- `add` 方法用于动态添加设置项
|
||||
- `remove` 方法用于动态删除设置项
|
||||
- `update` 方法用于动态更新设置项
|
||||
- `show` 属性用于设置是否显示全部设置项
|
||||
- `toggle` 属性用于切换是否显示全部设置项
|
||||
- `update` 方法动态更新设置项
|
||||
- `toggle` 方法用于切换是否显示全部设置项
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
|
||||
@@ -2,12 +2,6 @@
|
||||
|
||||
这里的 `静态属性` 是指挂载在 `构造函数` 的 `一级属性`,非常少使用
|
||||
|
||||
:::warning 提示
|
||||
|
||||
有些属性是全大写的,说明这些属性是不稳定的,可能会在将来被更改
|
||||
|
||||
:::
|
||||
|
||||
## `instances`
|
||||
|
||||
返回全部播放器实例的数组,假如你想同时管理多个播放器的时候,可以用到该属性
|
||||
@@ -139,76 +133,4 @@ console.info(Artplayer.html);
|
||||
|
||||
```js
|
||||
console.info(Artplayer.option);
|
||||
```
|
||||
|
||||
## `DEBUG`
|
||||
|
||||
## `CONTEXTMENU`
|
||||
|
||||
## `NOTICE_TIME`
|
||||
|
||||
## `SETTING_WIDTH`
|
||||
|
||||
## `SETTING_ITEM_WIDTH`
|
||||
|
||||
## `SETTING_ITEM_HEIGHT`
|
||||
|
||||
## `INDICATOR_SIZE`
|
||||
|
||||
## `INDICATOR_SIZE_ICON`
|
||||
|
||||
## `INDICATOR_SIZE_MOBILE`
|
||||
|
||||
## `INDICATOR_SIZE_MOBILE_ICON`
|
||||
|
||||
## `VOLUME_PANEL_WIDTH`
|
||||
|
||||
## `VOLUME_HANDLE_WIDTH`
|
||||
|
||||
## `RESIZE_TIME`
|
||||
|
||||
## `SCROLL_TIME`
|
||||
|
||||
## `SCROLL_GAP`
|
||||
|
||||
## `AUTO_PLAYBACK_MAX`
|
||||
|
||||
## `AUTO_PLAYBACK_MIN`
|
||||
|
||||
## `AUTO_PLAYBACK_TIMEOUT`
|
||||
|
||||
## `RECONNECT_TIME_MAX`
|
||||
|
||||
## `RECONNECT_SLEEP_TIME`
|
||||
|
||||
## `CONTROL_HIDE_TIME`
|
||||
|
||||
## `DB_CLICE_TIME`
|
||||
|
||||
## `MOBILE_AUTO_PLAYBACKRATE`
|
||||
|
||||
## `MOBILE_AUTO_PLAYBACKRATE_TIME`
|
||||
|
||||
## `MOBILE_AUTO_ORIENTATION_TIME`
|
||||
|
||||
## `INFO_LOOP_TIME`
|
||||
|
||||
## `FAST_FORWARD_VALUE`
|
||||
|
||||
## `FAST_FORWARD_TIME`
|
||||
|
||||
## `TOUCH_MOVE_RATIO`
|
||||
|
||||
## `VOLUME_STEP`
|
||||
|
||||
## `SEEK_STEP`
|
||||
|
||||
## `PROGRESS_HEIGHT`
|
||||
|
||||
## `PLAYBACK_RATE`
|
||||
|
||||
## `ASPECT_RATIO`
|
||||
|
||||
## `FLIP`
|
||||
|
||||
## `FULLSCREEN_WEB_IN_BODY`
|
||||
```
|
||||
@@ -102,8 +102,25 @@ art.on('ready', () => {
|
||||
art.url = '/assets/sample/video.mp4'
|
||||
});
|
||||
|
||||
art.on('restart', () => {
|
||||
console.info('restart');
|
||||
art.on('restart', (url) => {
|
||||
console.info('restart', url);
|
||||
});
|
||||
```
|
||||
|
||||
## `loop`
|
||||
|
||||
当出现区间循环时触发
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js{6}
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('loop', (start, end) => {
|
||||
console.info('loop', start, end);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -179,27 +196,6 @@ art.on('destroy', () => {
|
||||
});
|
||||
```
|
||||
|
||||
## `url`
|
||||
|
||||
当视频地址变化时触发
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js{10}
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('ready', () => {
|
||||
art.url = '/assets/sample/video.mp4?t=0'
|
||||
});
|
||||
|
||||
art.on('url', (url) => {
|
||||
console.info('url', url);
|
||||
});
|
||||
```
|
||||
|
||||
## `focus`
|
||||
|
||||
当播放器获得焦点时触发
|
||||
@@ -212,8 +208,8 @@ var art = new Artplayer({
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('focus', () => {
|
||||
console.info('focus');
|
||||
art.on('focus', (event) => {
|
||||
console.info('focus', event);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -229,8 +225,8 @@ var art = new Artplayer({
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('blur', () => {
|
||||
console.info('blur');
|
||||
art.on('blur', (event) => {
|
||||
console.info('blur', event);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -246,8 +242,8 @@ var art = new Artplayer({
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('dblclick', () => {
|
||||
console.info('dblclick');
|
||||
art.on('dblclick', (event) => {
|
||||
console.info('dblclick', event);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -263,8 +259,8 @@ var art = new Artplayer({
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('click', () => {
|
||||
console.info('click');
|
||||
art.on('click', (event) => {
|
||||
console.info('click', event);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -297,8 +293,8 @@ var art = new Artplayer({
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('hover', (state) => {
|
||||
console.info('hover', state);
|
||||
art.on('hover', (state, event) => {
|
||||
console.info('hover', state, event);
|
||||
});
|
||||
```
|
||||
|
||||
@@ -353,6 +349,24 @@ art.on('view', (state) => {
|
||||
});
|
||||
```
|
||||
|
||||
## `lock`
|
||||
|
||||
在移动端,当锁定的状态发生变化时触发
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js{6}
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
lock: true,
|
||||
});
|
||||
|
||||
art.on('lock', (state) => {
|
||||
console.info('lock', state);
|
||||
});
|
||||
```
|
||||
|
||||
## `aspectRatio`
|
||||
|
||||
当播放器长宽比变化时触发
|
||||
|
||||
@@ -907,4 +907,25 @@ var art = new Artplayer({
|
||||
});
|
||||
|
||||
console.info(art.video);
|
||||
```
|
||||
|
||||
## `cssVar`
|
||||
|
||||
- Type: `Function`
|
||||
|
||||
动态获取或设置 `css` 变量
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js{8}
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
});
|
||||
|
||||
art.on('ready', () => {
|
||||
console.log(art.cssVar('--art-theme'));
|
||||
art.cssVar('--art-theme', 'green');
|
||||
console.log(art.cssVar('--art-theme'));
|
||||
});
|
||||
```
|
||||
Reference in new issue
Block a user