Внешние субтитры

Вы можете вынести субтитры во внешний контейнер, если они должны отображаться вне плеера. Нужно включить отлов событий API и поймать событие subtitles, а затем перекинуть контейнер субтитров наружу. Плеер присваивает контейнеру с субтитрами идентификатор pjs_playerID_subtitle (playerID - это id плеера).

<div id="player1"></div>
<div id="subtitle_container"></div>
<script>
   var player = new Playerjs({id:"player1", file:URL, subtitle:[En]URL,[Es]URL});
   function PlayerEvents(event,id,info){
      if(event=="subtitles"){
         document.getElementById("subtitle_container").appendChild( document.getElementById("pjs_player1_subtitle") );
      }
   }
</script>

Важные моменты

• Таким субтитрам нужно назначить статичное положение в CSS. Для примера выше это выглядит так #pjs_player1_subtitle{position:static!important;top:auto;left:auto;}
• Субтитры перестанут отображаться в полноэкранном режиме. Можно проделать обратную операцию, если нужно вернуть их обратно.
• Нужно установить значение отступа снизу для субтитров больше высоты панели управления, чтобы они не двигались вместе с ней.
• Параметры субтитров (цвета, размеры и так далее) продолжат работать после переноса их наружу (параметры можно отключить в настройках модуля).
• Это работает с версии 18.4

---