使用jQuery for IE7和IE8在Facebox中加载FLV

问题描述

几乎不用说，这在Chrome，Firefox和Safari中完美运行。 IE（任何版本）都是问题。

It goes almost without saying, this works perfectly in Chrome, Firefox, and Safari. IE (any version) being the problem.

目标：我正在尝试加载JWplayer，它在Facebox弹出窗口中加载来自S3的FLV。

Objective: I am trying to load JWplayer which loads an FLV from S3 in a Facebox popup.

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

HTML（haml）：

HTML (haml):

%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. 尽管视频设置为display：none;。无论如何它开始播放。


2. 当点击激活div时，IE7弹出一个错误大小的空白div与导航（参数设置为不显示导航和擦除器），并且没有按钮导航和灌木工作。 IE8显示正确的大小，但导航和擦除器无法正常工作，并且空白屏幕。

我猜：

我认为问题在于没有在正确的时间调用javascript。它似乎是在没有jwplayer的情况下加载facebox。至少我假设。因此导航就在那里的原因。我认为它没有读取javascript。

My guess:
I'm thinking that the problem is with the javascript not being called at the right times. It seems it's loading the facebox without the jwplayer. At least I assume. Hence the reason why the nav is there. I thinking that it did not read the javascript for that.

推荐答案

此代码将在实例化facebox javascript后成功加载JWplayer。在IE7或IE8中没有显示视频仍然有些麻烦，但JWplayer加载得恰到好处。

This code will successfully load JWplayer after the facebox javascript is instantiated. There is still something screwy going on with video not displaying in IE7 or IE8, but JWplayer loads appropriately.

HTML：

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

Javascript：

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;
 })
})

这篇关于使用jQuery for IE7和IE8在Facebox中加载FLV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！