カスタマイズ
基本機能
プレイリスト
チャプターマーカー
仕様
| パラメーター名 | 型 | 値 | 設定 | デフォルト値 |
|---|---|---|---|---|
| markers | object | style,tip | 任意 | - |
説明
シークバーにチャプターマーカーを表示させる。
markers[].object
仕様
| パラメーター名 | 型 | 値 | 設定 | デフォルト値 |
|---|---|---|---|---|
| style | object | width,background_color,font_color | 任意 | - |
| tip | array | time,text | 任意 | - |
説明
| パラメーター名 | 説明 |
|---|---|
| style | マーカーのスタイル情報を設定します。 |
| tip | マーカーの表示位置とテキスト情報を設定します。 |
markers[].style.object
仕様
| パラメーター名 | 型 | 値 | 設定 | デフォルト値 |
|---|---|---|---|---|
| width | string | px | 任意 | - |
| background_color | string | color | 任意 | - |
| font_color | string | color | 任意 | - |
説明
| パラメーター名 | 説明 |
|---|---|
| width | シークバーに表示されるマーカーのサイズを設定します。 |
| background_color | シークバーに表示されるマーカーのカラーを設定します。 |
| font_color | シークバーをマウスホバーしたときに表示されるテキストのカラーを設定します。 |
markers[].tip[].object
仕様
| パラメーター名 | 型 | 値 | 設定 | デフォルト値 |
|---|---|---|---|---|
| time | number | - | 任意 | - |
| text | string | text | 任意 | - |
説明
| パラメーター名 | 説明 |
|---|---|
| time | 動画の秒数を記入し、シークバー上でその秒数地点にマーカーを表示させる設定をします。 |
| text | マーカーに表示させるテキストを設定します。 |
コードサンプル
<script>
const options = {
playlist: [
{
markers:
{
style:
{
width: '15px',
background_color: '#7fff00',
font_color: '#7fff00',
},
tip: [
{
time:"5",
text:"videog",
},
{
time:"10",
text:"videog_2",
}
],
},
...
},
],
};
const player = videogplayer('video_tag_id', options);
</script>