Adds a custom button to the player's control bar.
Placement:
Buttons are added to the righthand-side grouping of icons in the control bar. Buttons are added all the way to the left of the grouping, except if there is a logo in the control bar. In this case, buttons will be added to the right of the logo. Multiple buttons are added from right to left in the order they are entered.
Styling:
While the icon attribute will display any image provided as a URL, we recommend inlining SVGs here instead of providing an external path. This allows the button to map to skin.controlbar.icons and skin.controlbar.iconsActive customization options.
| Attribute | Description |
|---|---|
callback* function | The JavaScript function that is called when the button is clicked. |
id* string | The string used to identify the button. It must be unique across all buttons (an error is thrown otherwise). |
img* string | The image that will be used as the button icon. Can be the url to an image or the content of an SVG in string. Monochromatic, white icons of 24x24 pixels work well. |
tooltip* string | A tooltip label to display when the button is hovered. |
btnClass string | An optional CSS class name added to the button element. |