x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-20 04:01:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
Harvey committed 2022-02-14 10:09:58 +08:00
1 parent 5a6a92806c
commit 3bf4db8529
44 files changed
+157 -145
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer-document/docs/en/Questions/How to add setting panel.md
+11 -5
View File
@@ -9,11 +9,11 @@ Settings panels are similar to a collection of list selections, and support mult
| ---------- | ------------------- | ------------------------ |
| `html` | `String`、`Element` | DOM elements of selector |
| `icon` | `String`、`Element` | Icon of selector |
| `selector` | `Array` | Selector List |
| `onSelect` | `Function` | Selector Click event |
| `selector` | `Array` | Selector list |
| `onSelect` | `Function` | Selector click event |
| `width` | `Number` | Panel width |
| `default` | `Boolean` | Default selected |
| `tooltip` | `String` | Tooltip Text |
| `tooltip` | `String` | Tooltip text |
<div className="run-code">▶ Run Code</div>
@@ -29,6 +29,7 @@ var art = new Artplayer({
{
html: 'Select Subtitle',
width: 250,
tooltip: 'Subtitle 01',
selector: [
{
default: true,
@@ -40,15 +41,18 @@ var art = new Artplayer({
url: '/assets/sample/subtitle.srt?id=2',
},
],
onSelect: function onSubtitleSelect(item, $dom) {
onSelect: function(item, $dom) {
console.info(item, $dom);
art.subtitle.url = item.url;
// Change the tooltip
return item.html;
},
},
{
html: 'Select Quality',
width: 150,
tooltip: '1080P',
selector: [
{
default: true,
@@ -64,9 +68,11 @@ var art = new Artplayer({
url: '/assets/sample/video.mp4?id=360',
},
],
onSelect: function onQualitySelect(item, $dom) {
onSelect: function(item, $dom) {
console.info(item, $dom);
art.switchQuality(item.url, item.html);
// Change the tooltip
return item.html;
},
},
packages/artplayer-document/docs/zh-cn/Questions/How to add setting panel.md
+11 -5
View File
@@ -13,7 +13,7 @@ sidebar_position: 6
| `onSelect` | `Function` | 元素点击事件 |
| `width` | `Number` | 列表宽度 |
| `default` | `Boolean` | 是否默认选中 |
| `tooltip` | `String` | 描述文案 |
| `tooltip` | `String` | 提示文本 |
<div className="run-code">▶ Run Code</div>
@@ -29,26 +29,30 @@ var art = new Artplayer({
{
html: '选择字幕',
width: 250,
tooltip: '字幕 01',
selector: [
{
default: true,
html: '<span style="color:red">Subtitle 01</span>',
html: '<span style="color:red">字幕 01</span>',
url: '/assets/sample/subtitle.srt?id=1',
},
{
html: '<span style="color:yellow">Subtitle 02</span>',
html: '<span style="color:yellow">字幕 02</span>',
url: '/assets/sample/subtitle.srt?id=2',
},
],
onSelect: function onSubtitleSelect(item, $dom) {
onSelect: function(item, $dom) {
console.info(item, $dom);
art.subtitle.url = item.url;
// 改变提示文本
return item.html;
},
},
{
html: '选择画质',
width: 150,
tooltip: '1080P',
selector: [
{
default: true,
@@ -64,9 +68,11 @@ var art = new Artplayer({
url: '/assets/sample/video.mp4?id=360',
},
],
onSelect: function onQualitySelect(item, $dom) {
onSelect: function(item, $dom) {
console.info(item, $dom);
art.switchQuality(item.url, item.html);
// 改变提示文本
return item.html;
},
},