Как получить полноэкранное видео на jwplayer при использовании с fancybox

Как мне получить полноэкранное видео на jwplayer при использовании его с fancybox? Прямо сейчас у меня есть fancybox, открывающий div, который содержит встраивание jwplayer, и он отлично работает, видео воспроизводится при нажатии кнопки воспроизведения и т. д., так что все хорошо. Единственная проблема заключается в том, что когда я нажимаю полноэкранный режим на видео, он воспроизводит полноэкранное видео ЗА браузером и всплывающим окном facybox, поэтому я не могу его правильно увидеть. Мне нужно, чтобы полноэкранный режим был сфокусирован. Я заметил, что fancybox использует много значений z-index, в этом причина?

Любая помощь будет высоко оценена, спасибо.


jquery jwplayer fancybox
person Jizbo Jonez    schedule 07.01.2012    source источник

Ответы (1)


arrow_upward
9
arrow_downward

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

Рекомендуемый метод, если вы планируете показывать их в fancybox, — это вызывать их по запросу, поэтому с помощью этого html:

<a class="video" href="pathToVideo/video.flv">open my video in fancybox</a>

используйте этот скрипт:

<script type="text/javascript">
 $(document).ready(function(){
  $("a.video").click(function() {
   $.fancybox({
    'padding' : 0, // optional
    'title' : this.title,
    'content': '<embed src="jwplayer.swf?file='+this.href+'&amp;autostart=true&amp;fs=1" type="application/x-shockwave-flash" width="352" height="240" wmode="opaque" allowfullscreen="true" allowscriptaccess="always"></embed>'               
   }); // fancybox
   return false;
  }); // click
 }); // ready
</script>

См. пример здесь

person JFK    schedule 07.01.2012
comment
Что касается видео, переходящего в полноэкранный режим из-за моего браузера, похоже, это проблема Windows 7. Мой компьютер отключался и заставлял мой браузер оставаться поверх всех других окон, а не только полноэкранного видео. Я перезагрузился и все заработало отлично. - person Jizbo Jonez; 10.01.2012
comment
Спасибо за информацию, которую вы предоставили JFK. Я очень скоро попробую ваш код. - person Jizbo Jonez; 10.01.2012
comment
Я буду использовать настройку jwplayer после того, как fancybox добавит некоторый заполнитель. 'content': '‹div id=player›‹/div›', а затем jwplayer(player).setup({file:video.mp4}) - person funrob; 05.01.2014
comment
@funrob: вы можете опубликовать свой собственный ответ, если хотите (улучшения всегда приветствуются). Этому ответу 2 года, и с тех пор jwplayer развился. Убедитесь, что вы указали в своем ответе, требуется ли какой-либо дополнительный js API (хотя этот ответ не требует) - person JFK; 05.01.2014