Использование video.js события useractive и userinactive с videojs-overlay не работают немедленно

#events #video.js #dom-events #videojs-overlay

#Мероприятия #video.js #dom-события #videojs-overlay

Вопрос:

В video.js проигрывателе я хочу отображать информацию о воспроизводимом в данный момент видео в виде videojs-overlay всякий раз, когда пользователь активен (наведение курсора мыши на видео) и скрывать информацию, когда пользователь неактивен (не наведение курсора мыши на видео).).

Я настроил videojs-overlay прослушивание таких событий, как useractive и userinactive :

 player.overlay({
  content: 'Default overlay content',
  debug: true,
  overlays: [{
    content: 'The user is active!',
    start: 'useractive',
    end: 'userinactive'
  }]
});

К сожалению, наложение сначала не запускается, но затем оно начинает работать после воспроизведения видео в течение примерно 1 минуты.

Есть ли проблема с моей настройкой, или это может быть ошибка в videojs или videojs-overlay ? Что я могу сделать для отладки этого?

1. Эти два события кажутся мне довольно неточными / нечетко определенными. ‘userinactive’ ОПРЕДЕЛЯЕТСЯ как «… после небольшой задержки …» здесь: docs.videojs.com/docs/api/player.html#events Также это не будет работать на устройстве с сенсорным экраном (например, планшете)

Ответ №1:

Видео.JS уже отслеживает активное состояние пользователя с помощью классов CSS. Пример этого можно найти в плагине videojs-dock. Он использует классы vjs-user-inactive и vjs-user-active CSS для управления отображением или скрытием док-станции или трея над видео, которые могут использоваться для отображения такой информации, как заголовок или описание видео. Возможно, вы сможете использовать это как вдохновение для своего наложения.

Пожалуйста, дайте мне знать, если у вас возникнут какие-либо дополнительные вопросы.

Отказ от ответственности: Я работаю в Brightcove.

1. Я мог бы легко адаптироваться videojs-dock в соответствии с моими потребностями. Большое вам спасибо за подсказку и за то, что направили меня к классам vjs-user-inactive и vjs-user-active CSS. Конечно, мне все еще любопытно, почему события useractive и userinactive не сработали так, как я ожидал.