[HTML5] JWPlayerで字幕のスタイルを指定する – 端くれプログラマの備忘録

以下に解説あり。

Styling Captions for FCC Compliance | JW Player
https://support.jwplayer.com/customer/portal/articles/1482067

JWPlayerオプション指定

captionsオブジェクトで指定できる。

var playerInstance = jwplayer("myElement")
playerInstance.setup({
    playlist: [{
        file: "/assets/sintel.mp4",
        image: "/assets/sintel.jpg",
        tracks: [{
            file: "/assets/captions-en.vtt",
            label: "English",
            kind: "captions",
            "default": true
        },{
            file: "/assets/captions-fr.vtt",
            kind: "captions",
            label: "French"
        }]
    }],
    captions: {
        color: '#FF0000',
        fontSize: 24,
        backgroundOpacity: 50
    }
});

var playerInstance = jwplayer("myElement")

playerInstance.setup({

playlist: [{

file: "/assets/sintel.mp4",

image: "/assets/sintel.jpg",

tracks: [{

file: "/assets/captions-en.vtt",

label: "English",

kind: "captions",

"default": true

},{

file: "/assets/captions-fr.vtt",

kind: "captions",

label: "French"

}]

}],

captions: {

color: '#FF0000',

fontSize: 24,

backgroundOpacity: 50

}

});

JWPlayerオプション指定

関連記事