Chapters
Vimeo Chapters available to Pro users and above have the opportunity to edit chapter markers on their videos. With the use of the Controls Markers plugin. The chapter information can be displayed on the controlbar and controlled to seek to cuepoints from a Chapters menu or an external Html list.
<div class="flex w-full h-auto my-auto">
<div id="chapters" class=""></div>
</div>
<script type="text/javascript">
var player = jwplayer("chapters").setup({
"aspectratio": "16:9",
"playbackRateControls": true,
"plugins": {
"/plugins/jwplayer/controls-markers/js/videomarkers-8.1.0.js": {
"container": "#markers-list",
"menu": true
}
},
"sources": [
{
"file": "https://vimeo.com/399759138",
"type": "mp4"
}
],
"vimeo": {
"chapters": true,
"pro": true
},
"width": "100%"
});
player.on("cuepoint", function (cue) {
if (cue.chapters) {
console.log("Cuepoint Marker ", cue);
}
})
.on("markerselect", function (marker) {
console.log("Marker ", marker);
}).on("chapter-markers", function(markers) {
console.log("Markers ", markers);
});
</script>
