Как воспроизвести полноэкранное видео по клику? (AngularJS)

0

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

Я точно имею видео в локальном файле.

Я использую угловой для своего сайта, я не знаю, возможно ли это.

Спасибо, парни,

Нама

  • 0
    Самое главное, где находится видео: Youtube, Vimeo, локальный файл? Вы должны заглянуть в developers.google.com/youtube/iframe_api_reference?hl=en
  • 0
    Спасибо за Ваш ответ. У меня есть видео в локальном файле, вы знаете, как это сделать?
Теги:
video
fullscreen

2 ответа

0

Вы должны посмотреть на https://github.com/videojs/video.js

По существу, вы добавляете это на свою веб-страницу:

<link href="http://vjs.zencdn.net/5.0/video-js.min.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/5.0/video.min.js"></script>

И затем, поместите этот элемент, где вы хотите своего игрока. Измените значения в соответствии с вашими потребностями (размер, изображение плаката, пути).

<video id="really-cool-video" class="video-js vjs-default-skin" controls
 preload="auto" width="640" height="264" poster="really-cool-video-poster.jpg"
 data-setup='{}'>
  <source src="really-cool-video.mp4" type='video/mp4'>
  <source src="really-cool-video.webm" type='video/webm'>
  <p class="vjs-no-js">
    To view this video please enable JavaScript, and consider upgrading to a web browser
    that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
  </p>
</video>

Если вы хотите использовать больше параметров (автовоспроизведение, предварительная загрузка и т.д.), Вы можете добавить их как атрибут данных, такой как высота и плакат, или добавить их в настройки данных, разделенные запятыми, например:

<video id="really-cool-video" class="video-js vjs-default-skin" controls
     preload="auto" width="640" height="264" poster="really-cool-video-poster.jpg"
     data-setup='{ "autoplay": true, "preload": "auto"}'>

Вы можете посмотреть возможный вариант: http://docs.videojs.com/docs/guides/options.html

Поделиться
  • 0
    Спасибо Кузин за вашу помощь. Моей первой идеей было использовать изображение с кнопкой воспроизведения посередине и открыть полноэкранное видео по нажатию на эту кнопку. В любом случае я собираюсь попробовать использовать <video>, но знаете ли вы, как открыть его в полноэкранном режиме?
  • 0
    Я бы не рекомендовал автоматически переходить в полноэкранный режим, так как он обычно создает неудобства для пользователя и может быть проблематичным на некоторых устройствах. Однако вы можете посмотреть, как связать метод fullcreen с событием bind или чем-то подобным. См. Docs.videojs.com/docs/guides/api.html . И я имею в виду, просто прочитайте документ, это все там.
0

Вы можете использовать плагины фонового видео like-

https://github.com/caseyhen/background-video

Поделиться
  • 0
    Спасибо человек, но я не хочу использовать его в качестве фона для видео. Я просто хочу открыть полноэкранное видео по клику, и я бы также выйти из него при выходе

Ещё вопросы

Сообщество Overcoder
Наверх
Меню