mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-24 23:23:18 -08:00
update
This commit is contained in:
Harvey authored and Harvey Zack committed
1 parent
c7a60b1084
commit
8398305d6a
7 files changed
+49
-219
No files matched your search
@@ -251,25 +251,6 @@ var art = new Artplayer({
|
||||
});
|
||||
```
|
||||
|
||||
## rotate
|
||||
|
||||
- Type: `Boolean`
|
||||
- Default: `false`
|
||||
|
||||
Whether to display a video rotation function, you need to set the `setting` and `autoSize` for `true`
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
rotate: true,
|
||||
setting: true,
|
||||
autoSize: true,
|
||||
});
|
||||
```
|
||||
|
||||
## playbackRate
|
||||
|
||||
- Type: `Boolean`
|
||||
@@ -487,60 +468,6 @@ var art = new Artplayer({
|
||||
});
|
||||
```
|
||||
|
||||
## localVideo
|
||||
|
||||
- Type: `Boolean`
|
||||
- Default: `false`
|
||||
|
||||
To open a local video, you need to use the `art.plugins.localVideo.attach` method to mount the open video button
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
localVideo: true,
|
||||
controls: [
|
||||
{
|
||||
name: 'preview',
|
||||
position: 'right',
|
||||
html: 'Open video',
|
||||
mounted: ($preview) => {
|
||||
art.plugins.localVideo.attach($preview);
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
```
|
||||
|
||||
## localSubtitle
|
||||
|
||||
- Type: `Boolean`
|
||||
- Default: `false`
|
||||
|
||||
To open local subtitles, you need to use the `art.plugins.localSubtitle.attach` method to mount the open subtitle button
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
localSubtitle: true,
|
||||
controls: [
|
||||
{
|
||||
name: 'preview',
|
||||
position: 'right',
|
||||
html: 'Open subtitle',
|
||||
mounted: ($preview) => {
|
||||
art.plugins.localSubtitle.attach($preview);
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
```
|
||||
|
||||
## useSSR
|
||||
|
||||
- Type: `Boolean`
|
||||
@@ -623,18 +550,7 @@ var art = new Artplayer({
|
||||
- Type: `Array`
|
||||
- Default: `[]`
|
||||
|
||||
Initialize custom setting panel
|
||||
|
||||
| Property | Type | Description |
|
||||
| --------- | ------------------- | ------------------------------------------------------------- |
|
||||
| `disable` | `Boolean` | Whether to disable the component |
|
||||
| `name` | `String` | The unique name of the component, used to mark the class name |
|
||||
| `index` | `Number` | Component index, priority for display |
|
||||
| `html` | `String`、`Element` | DOM element of the component |
|
||||
| `style` | `Object` | Component style object |
|
||||
| `click` | `Function` | Component click event |
|
||||
| `mounted` | `Function` | Triggered after the component is mounted |
|
||||
| `tooltip` | `String` | Prompt text of the component |
|
||||
Initialize custom setting panel, please visit [How to add setting](/document/Questions/)
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
@@ -645,30 +561,21 @@ var art = new Artplayer({
|
||||
setting: true,
|
||||
settings: [
|
||||
{
|
||||
disable: false,
|
||||
name: 'button',
|
||||
index: 10,
|
||||
html: 'Custom button1',
|
||||
tooltip: 'Custom button1',
|
||||
style: {
|
||||
color: 'red',
|
||||
},
|
||||
click: function () {
|
||||
console.log('You clicked custom button 1');
|
||||
},
|
||||
mounted: function () {
|
||||
console.log('Custom button mounting is complete 1');
|
||||
},
|
||||
},
|
||||
{
|
||||
html: 'Custom button2',
|
||||
tooltip: 'Custom button2',
|
||||
style: {
|
||||
color: 'green',
|
||||
},
|
||||
click: function () {
|
||||
console.log('You clicked custom button 2');
|
||||
},
|
||||
html: 'Custom setting 01',
|
||||
items: [
|
||||
{
|
||||
html: 'Submenu 01',
|
||||
click: function() {
|
||||
console.log('You click on the submenu 01');
|
||||
}
|
||||
},
|
||||
{
|
||||
html: 'Submenu 02',
|
||||
click: function() {
|
||||
console.log('You click on the submenu 02');
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
---
|
||||
title: How to add setting
|
||||
sidebar_position: 6
|
||||
---
|
||||
@@ -251,25 +251,6 @@ var art = new Artplayer({
|
||||
});
|
||||
```
|
||||
|
||||
## rotate
|
||||
|
||||
- 类型: `Boolean`
|
||||
- 默认: `false`
|
||||
|
||||
是否显示视频旋转功能，需要同时设置 `setting` 和 `autoSize` 为 `true`
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
rotate: true,
|
||||
setting: true,
|
||||
autoSize: true,
|
||||
});
|
||||
```
|
||||
|
||||
## playbackRate
|
||||
|
||||
- 类型: `Boolean`
|
||||
@@ -487,60 +468,6 @@ var art = new Artplayer({
|
||||
});
|
||||
```
|
||||
|
||||
## localVideo
|
||||
|
||||
- 类型: `Boolean`
|
||||
- 默认: `false`
|
||||
|
||||
打开本地视频，需要使用`art.plugins.localVideo.attach`方法挂载打开视频按钮
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
localVideo: true,
|
||||
controls: [
|
||||
{
|
||||
name: 'preview',
|
||||
position: 'right',
|
||||
html: '打开视频',
|
||||
mounted: ($preview) => {
|
||||
art.plugins.localVideo.attach($preview);
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
```
|
||||
|
||||
## localSubtitle
|
||||
|
||||
- 类型: `Boolean`
|
||||
- 默认: `false`
|
||||
|
||||
打开本地字幕，需要使用`art.plugins.localSubtitle.attach`方法挂载打开字幕按钮
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
```js
|
||||
var art = new Artplayer({
|
||||
container: '.artplayer-app',
|
||||
url: '/assets/sample/video.mp4',
|
||||
localSubtitle: true,
|
||||
controls: [
|
||||
{
|
||||
name: 'preview',
|
||||
position: 'right',
|
||||
html: '打开字幕',
|
||||
mounted: ($preview) => {
|
||||
art.plugins.localSubtitle.attach($preview);
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
```
|
||||
|
||||
## useSSR
|
||||
|
||||
- 类型: `Boolean`
|
||||
@@ -623,18 +550,7 @@ var art = new Artplayer({
|
||||
- 类型: `Array`
|
||||
- 默认: `[]`
|
||||
|
||||
初始化自定义的设置面板
|
||||
|
||||
| 属性 | 类型 | 描述 |
|
||||
| --------- | ------------------- | -------------------------- |
|
||||
| `disable` | `Boolean` | 是否禁用组件 |
|
||||
| `name` | `String` | 组件唯一名称，用于标记类名 |
|
||||
| `index` | `Number` | 组件索引，用于显示的优先级 |
|
||||
| `html` | `String`、`Element` | 组件的 DOM 元素 |
|
||||
| `style` | `Object` | 组件样式对象 |
|
||||
| `click` | `Function` | 组件点击事件 |
|
||||
| `mounted` | `Function` | 组件挂载后触发 |
|
||||
| `tooltip` | `String` | 组件的提示文本 |
|
||||
初始化自定义的设置面板，更多信息请访问 [怎么添加设置面板](/document/zh-cn/Questions/)
|
||||
|
||||
<div className="run-code">▶ Run Code</div>
|
||||
|
||||
@@ -645,30 +561,21 @@ var art = new Artplayer({
|
||||
setting: true,
|
||||
settings: [
|
||||
{
|
||||
disable: false,
|
||||
name: 'button',
|
||||
index: 10,
|
||||
html: '自定义按钮',
|
||||
tooltip: '自定义按钮的提示1',
|
||||
style: {
|
||||
color: 'red',
|
||||
},
|
||||
click: function () {
|
||||
console.log('你点击了自定义按钮1');
|
||||
},
|
||||
mounted: function () {
|
||||
console.log('自定义按钮挂载完成1');
|
||||
},
|
||||
},
|
||||
{
|
||||
html: '自定义按钮2',
|
||||
tooltip: '自定义按钮的提示2',
|
||||
style: {
|
||||
color: 'green',
|
||||
},
|
||||
click: function () {
|
||||
console.log('你点击了自定义按钮2');
|
||||
},
|
||||
html: '自定义设置01',
|
||||
items: [
|
||||
{
|
||||
html: '子菜单01',
|
||||
click: function() {
|
||||
console.log('你点击了子菜单01');
|
||||
}
|
||||
},
|
||||
{
|
||||
html: '子菜单02',
|
||||
click: function() {
|
||||
console.log('你点击了子菜单01');
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
---
|
||||
title: 怎么添加设置面板
|
||||
sidebar_position: 6
|
||||
---
|
||||
Reference in new issue
Block a user