Загрузка FLV в Facebox с помощью jQuery для IE7 и IE8 - PullRequest
0 голосов
/ 16 июня 2010

Само собой разумеется, это прекрасно работает в Chrome, Firefox и Safari. IE (любая версия) является проблемой.

Цель: Я пытаюсь загрузить JWplayer, который загружает FLV из S3 во всплывающем окне Facebox.

jQuery(document).ready(function($) {
  $('a[rel*=facebox]').facebox() 
})

HTML (хамл):

%li#videoGirl
  = link_to 'What is HQchannel?', '#player', :rel => 'facebox'

.grid_8.omega.alpha#player{:style => 'display: none;'}
  :javascript
    var so = new SWFObject('/flash/playerTrans.swf','mpl','640px','360px','0');
    so.addParam('allowscriptaccess','always');
    so.addParam('allowfullscreen','true');
    so.addParam('wmode','transparent');
    so.addVariable('file', 'http://hometownquarterlyvideos.s3.amazonaws.com/whatishqchannel.flv&autostart=true&controlbar=none&repeat=always&image=/flash/video_girl/whatishqchannel.jpg&icons=false&screencolor=none&backcolor=FFFFFF&screenalpha=0&overstretch');
    so.addVariable('overstretch', 'true')
    so.write('player');

Проблема:

  1. Несмотря на то, что для видео установлено отображение: нет ;. Все равно начинает играть.
  2. При щелчке на активационном div, IE7 выдает пустой неверный размер div с навигацией (параметры установлены, чтобы не показывать навигацию и очистку), и никакие кнопки на навигации и работе не работают. IE8 показывает правильный размер, но такое же поведение, когда навигация и скруббер не работают, и пустой экран.

Мое предположение:
Я думаю, что проблема в том, что JavaScript не вызывается в нужное время. Кажется, он загружает Facebox без jwplayer. По крайней мере, я предполагаю. Отсюда и причина, почему там есть навигация. Я думаю, что он не читал javascript для этого.

Ответы [ 2 ]

0 голосов
/ 22 июня 2010

Этот код успешно загрузит JWplayer после того, как будет создан javascript для facebox. По-прежнему происходит что-то странное с видео, которое не отображается в IE7 или IE8, но JWplayer загружается соответствующим образом.

HTML:

<a class="flash" href="http://hometownquarterlyvideos.s3.amazonaws.com/whatishqchannel.flv" rel="/flash/video_girl/whatishqchannel.jpg">Flash</a>

Javascript:

$(document).ready(function(){
 // click on flash video link
 $('.flash').click(function(){
  $.facebox('<div id="fbvideo"></div>');
  var so = new SWFObject('/flash/playerTrans.swf','fbvideo','640px','360px','0');
  so.addParam('allowscriptaccess','always');
  so.addParam('allowfullscreen','true');
  so.addParam('wmode','transparent');
  so.addVariable('file', $(this).attr('href'));
  so.addVariable('autostart','true');
  so.addVariable('controlbar','none');
  so.addVariable('repeat','always');
  so.addVariable('image',$(this).attr('rel'));
  so.addVariable('icons','false')
  so.addVariable('screencolor','none');
  so.addVariable('backcolor','FFFFFF');
  so.addVariable('screenalpha','0');
  so.addVariable('overstretch', 'true');
  so.write('fbvideo');
  return false;
 })
})
0 голосов
/ 17 июня 2010

Здесь есть несколько проблем.

ПЕРВЫЙ ВЫПУСК: SWFOBJECT

Я думаю, что вы видите нежелательное / непредсказуемое поведение, потому что ваш синтаксис SWFObject немного отключен.С SWFObject вы можете:

1.) Использовать addParam ('flashvars', FLASHVARS), где FLASHVARS - это объединенная строка параметров конфигурации, разделенных символом &, т.е.

var so = new SWFObject('/flash/playerTrans.swf','mpl','640px','360px','0');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('wmode','transparent');
so.addParam('flashvars', 'file=http://hometownquarterlyvideos.s3.amazonaws.com/whatishqchannel.flv&amp;autostart=true&amp;controlbar=none&amp;repeat=always&amp;image=/flash/video_girl/whatishqchannel.jpg&amp;icons=false&amp;screencolor=none&amp;backcolor=FFFFFF&amp;screenalpha=0&amp;overstretch=true');
so.write('player');

ИЛИ

2.) Используйте несколько операторов addVariable, например:

var so = new SWFObject('/flash/playerTrans.swf','mpl','640px','360px','0');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('wmode','transparent');
so.addVariable('file', 'http://hometownquarterlyvideos.s3.amazonaws.com/whatishqchannel.flv');
so.addVariable('autostart', 'true');
so.addVariable('controlbar', 'none');
so.addVariable('repeat', 'always');
so.addVariable('image', '/flash/video_girl/whatishqchannel.jpg');
so.addVariable('icons', 'false');
so.addVariable('screencolor', 'none');
so.addVariable('backcolor', 'FFFFFF');
so.addVariable('screenalpha', '0');
so.addVariable('overstretch', 'true');
so.write('player');

Если вам нужна дополнительная информация, есть отличное руководство по Внедрение Flash на JWСайт игрока и мастер настройки , который предоставит готовый к использованию код SWFObject.

ВТОРОЙ ВЫПУСК: AUTOSTART WHILE Отображение: отсутствует

Thisэто быстрый IE.В большинстве браузеров Flash отключается при установке отображения: нет.Это не так в IE.Чтобы предотвратить это, вам нужно установить

so.addVariable('autostart', 'false');

Если вы используете немного JS для установки свойства отображения CSS, и вы хотите, чтобы проигрыватель начал играть, когда он появляется, яЯ бы посоветовал вам изменить JS для запуска и остановки проигрывателя через , это API .По общему признанию, это немного сложнее, но это все часть того, что все работает без проблем в разных браузерах.

Best,

Zach

Разработчик, LongTail Video

...