カスタマイズ

基本機能

プレイリスト

字幕

仕様
パラメーター名 設定 デフォルト値
captions object list,style 任意 -
説明

ビデオグプレーヤーに字幕を設定します。なお、プレイヤーのコントロールバーに字幕ボタンを表示させる場合はbtn_captionstrueに設定してください。

captions.object
仕様
パラメーター名 設定 デフォルト値
list array file,label,default 必須 null
style object color,fontSize,fontFamily,fontOpacity,backgroundColor,backgroundOpacity,edgeStyle,windowColor,windowOpacity 任意 -
説明
パラメーター名 説明
list 字幕ファイルを設定します。
style 字幕のstyleを設定します。
captions.list.object
仕様
パラメーター名 設定 デフォルト値
file string url 必須 null
label string text 必須 index
default boolean true,false 任意 false
説明
パラメーター名 説明
file 字幕ファイル(WebVTT,SRT,DFXP)のurlを設定します。
label 字幕のラベルを設定します。(英語、日本語等)。複数のcaptionを持つ場合でのみ使用され、字幕メニューにラベルが表示されます。
default 字幕を起動時に任意の字幕を表示する場合は、これをtrueに設定します。設定しない場合、字幕はデフォルトでオフになっており、ユーザーは字幕メニューを選択して有効にする必要があります
captions.style.object
仕様
パラメーター名 設定 デフォルト値
color string color 任意 #ffffff
fontSize string px,em,% 任意 1.5em
fontFamily string font-family 任意 sans-serif
fontOpacity number 0-100 任意 100
backgroundColor string color 任意 #000000
backgroundOpacity number 0-100 任意 100
edgeStyle string none,dropshadow,raised,depressed,uniform 任意 none
windowColor string color 任意 -
windowOpacity number 0-100 任意 100
説明
パラメーター名 説明
color 字幕の文字色を設定します。
fontSize 字幕の文字サイズを設定します。
fontFamily 字幕の種類を設定します。
fontOpacity 字幕文字の透明度をパーセントで設定します。0で透明、100で非透明になります。
backgroundColor 字幕の背景色を設定します。
backgroundOpacity 字幕文字の背景の透明度をパーセントで設定します。0で透明、100で非透明になります。
edgeStyle 字幕の陰影を設定します。
windowColor 字幕エリアの背景色を設定します。
windowOpacity 字幕エリアの背景の透明度をパーセントで設定します。0で透明、100で非透明になります。
コードサンプル
<script> const options = { playlist: [ { captions:{ list:[ { file:'https://sample1.jp/captions/jp.vtt', label:'日本語', default:true }, { file:'https://sample1.jp/captions/en.vtt', label:'英語' }, ], style:{ color:"#0000FF", fontSize:"3em", fontFamily:"serif", fontOpacity:50, backgroundColor:"#FFA500", backgroundOpacity:50, edgeStyle:"dropshadow", windowColor: "#5CFF82", windowOpacity: 50 }, }, ... }, ], }; const player = videogplayer('video_tag_id', options); </script>

results matching ""

    No results matching ""