Видео js - как добавить собственный значок в панель управления - PullRequest
Новая
       13

Видео js - как добавить собственный значок в панель управления

0 голосов
/ 02 марта 2020

Я использую библиотеку видео js для создания аудио плеера. Я хотел бы добавить пользовательский компонент, например изображение, в панель управления перед кнопкой воспроизведения.

Я читал, как добавить пользовательскую кнопку: 

var button = videojs.getComponent('Button');
var closeButton = videojs.extend(button, {
    constructor: function() {
        button.apply(this, arguments);
    },
    /*  handleClick: function() {
        this.player().dispose();
    }*/
});

Но это не работает, чтобы добавить изображение. Кто-нибудь может мне помочь? Большое спасибо

1 Ответ

0 голосов
/ 06 марта 2020

Для изображения вы можете добавить Компонент, который создает div, и добавить класс для его стилизации. 

<script>
  videojs('my_video').ready(function() {
    var img = this.controlBar.addChild('Component', {}, 0); // 3rd arg is index, i.e. first
    img.addClass("my-image");
  });
</script>
<style>
  .video-js .my-image {
    width: 40px;
    background: url(https://placekitten.com/38/28) center center no-repeat;
  }
</style>
...