Добавление субтитров к видео HTML5

#javascript #html #jquery #css #html5-video

#javascript #HTML #jquery #css #html5-видео

Вопрос:

Я создал пользовательский видеоплеер HTML5 с помощью JavaScript, я скрываю собственные элементы управления с помощью следующего js-кода:

 var video = document.getElementById("video");
video.controls = false;
  

Затем я настроил элементы управления (воспроизведение — Пауза — Полноэкранный режим …), все работало просто отлично.
Моя проблема в том, что я реализовал тег, как показано ниже:

 <track label="English" kind="subtitles" src="sub/vid_sub.vtt" srclang="en">
  

Субтитры не отображались, поэтому я выяснил, что код js, который скрывал элементы управления, также скрывал тег, я попытался найти способ отключить все собственные элементы управления, кроме тега, но не смог.
Если есть какой-либо способ исправить это, пожалуйста, дайте мне знать.

Ответ №1:

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

 for (var i = 0; i < video.textTracks.length; i  ) {
    if (video.textTracks[i].language == 'en') {
        video.textTracks[i].mode = 'showing';
 }
  

если вы хотите скрыть это следующим образом.

 track.mode="hidden";