1
Я думаю, что это очень простой/немой вопрос, но я не могу понять, что я делаю неправильно ... Я хотел бы добавить субтитры и временную шкалу к видео html5, используя popcorn.js.не может сделать popcorn.js работу
Вот код html5:
<script src="http://popcornjs.org/code/dist/popcorn-complete.js">
</script>
(...)
<nav id="timeline"> </nav>
(...)
<video id="video" controls>
<source src="media/ita.webm" type="video/webm">
<source src="media/ita.mp4" type="video/mp4">
</video>
(...)
Вот попкорн часть:
document.addEventListener("DOMContentLoaded", function() {
var popcorn = Popcorn('#video', { pauseOnLinkClicked: true });
popcorn.timeline({
start: 1,
target: "timeline",
title: "This is a title",
text: "this is some interesting text that goes inside",
innerHTML: "Click here for <a href='http://www.google.ca'>Google</a>" ,
direction: "down"
})
.timeline({
start: 3,
target: "#timeline",
title: "double as interesting",
text: "this is some interesting text that goes inside",
innerHTML: "Maybe a button? <button onClick=\"window.location.href='http://www.google.com'\">Click Me</button>",
direction: "down"
})
.timeline({
start: 7,
end: 10,
target: "#timeline",
title: "3x as interesting",
text: "this is some interesting text that goes inside",
innerHTML: "",
direction: "down"
});
popcorn.subtitle({
start: 1,
end: 5,
text: "Subtitle",
});
popcorn.play();
}, false);
pauseOnLinkClicked: true
это единственная часть, которая работает ...
Спасибо за ответы. Извините, я забыл изменить цели, но в любом случае я до сих пор не вижу субтитров и таймлайн. – Jan
@ Джан сделал мой пример не работает? –
Извините за задержку. Ваш пример работает, теперь в моем коде я вижу временную шкалу (со странным макетом), но у меня все еще нет субтитров, я постараюсь работать над ней еще немного. – Jan