Задать вопрос
@mr_andersen18
Начинающий верстальщик

Как во время проигрывания видео выводить в плеере ссылки на разные страницы по таймкоду?

есть сайт на Opencart 2. На этом сайте есть страница с просмотром видео. Как сделать, чтобы при воспроизведении видео в определенные моменты проигрывания этого видео в самом плеере отображались ссылки на какие-либо страницы? Я решил использовать тег video, у меня получилось вывести в самом плеере браузера по тайм-кодам информацию из файла *.vtt, но проблема в том, что там ссылки выводятся также в виде текста. вот моя разметка:

<?php if($video) { ?>
                                <video id="main_video" src="<?=$video;?>"  autoplay="autoplay" muted="false" controls="controls">
                                    <track class="hidden" kind="subtitles" label="English subtitles" src="subtitles_en.vtt" srclang="en" default></track>
                                </video>
<? } ?>


вот содержимое файла subtitles_en.vtt:

WEBVTT FILE

link
00:00:03.000 --> 00:00:15.500
tdekor.ld

вот еще у меня получилось получить таймкоды и подписи к нимиз этого файла с помощью js

var videoElement  = document.querySelector("video");
    var trackElements = document.querySelectorAll("track");
    var linkToProduct = document.querySelector(".link_to_product");
    // for each track element
    for (var i = 0; i < trackElements.length; i++) {
        trackElements[i].addEventListener("load", function() {
        var textTrack = this.track; // gotcha: "this" is an HTMLTrackElement, not a TextTrack object
        var isSubtitles = textTrack.kind === "subtitles"; // for example...
        // for each cue
            for (var j = 0; j < textTrack.cues.length; ++j) {
                var cue = textTrack.cues[j];
                // do something
            }
        });
    }
  • Вопрос задан
  • 46 просмотров
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы