How to add previous and next buttons in video.js

Question

I hope to know how to add previous and next buttons around play button on video.js controlBar.

When I check the controlBar functions, it seems there are not functions to point the position of custom button which added, and only exists such as addChild or appendChild functions, so now I am only writing as below.

this.controlBar.el().appendChild(nextButton.el());

So I am eager to know how to add custom button such as previous or next button into certain order, in my case, just before or after play button.

Please help me!!!

Answer 1

You can use insertBefore() here. Use this to insert a control after the first child, ie the play button:

player.controlBar.el().insertBefore(button.el(), player.controlBar.el().firstChild.nextSibling)

Or this to insert it before it:

player.controlBar.el().insertBefore(button.el(), player.controlBar.el().firstChild)