0

言うまでもなく、これはChrome、Firefox、Safariで完全に機能します。IE(任意のバージョン)が問題です。

目的: FaceboxポップアップでS3からFLVをロードするJWplayerをロードしようとしています。

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

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. ビデオが表示するように設定されているにもかかわらず:なし;。とにかく再生を開始します。
  2. アクティベーションdivをクリックすると、IE7はnavを含む間違ったサイズの空白のdivをポップアップし(パラメーターはnavとscrubberを表示しないように設定されています)、navとsrubberのボタンは機能しません。IE8は正しいサイズを示していますが、ナビゲーションとスクラバーが機能せず、画面が空白の場合と同じ動作を示します。

私の推測:
問題は、JavaScriptが適切なタイミングで呼び出されないことにあると考えています。jwplayerなしでフェイスボックスをロードしているようです。少なくとも私は推測します。したがって、ナビゲーションがそこにある理由。そのためのJavaScriptを読まなかったと思います。

4

2 に答える 2

0

ここにはいくつかの問題があります。

最初の問題:SWFOBJECT

SWFObjectの構文が少しずれているため、望ましくない/予測できない動作が見られると思います。SWFObjectを使用すると、次のいずれかを実行できます。

1.)addParam('flashvars'、FLASHVARS)を使用します。ここで、FLASHVARSは、&ampで区切られた構成オプションの連結文字列です。

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&autostart=true&controlbar=none&repeat=always&image=/flash/video_girl/whatishqchannel.jpg&icons=false&screencolor=none&backcolor=FFFFFF&screenalpha=0&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');

追加情報が必要な場合は、JW PlayerサイトのEmbeddingFlashに関する優れたチュートリアルと、すぐに使用できるSWFObjectコードを提供するセットアップウィザードがあります。

2番目の問題:表示中の自動開始:なし

これはIEクイックです。ほとんどのブラウザでは、display:noneを設定するとFlashが強制終了されます。これはIEには当てはまりません。これを防ぐには、設定する必要があります

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

少しのJSを使用してdisplayCSSプロパティを設定していて、プレーヤーが表示されたときにプレーヤーの再生を開始する場合は、JSを変更して、 APIを介してプレーヤーを開始および停止することをお勧めします。確かに、これはもう少し複雑ですが、それはすべて、クロスブラウザーでシームレスに機能させるための一部です。

一番、

ザック

開発者、LongTailビデオ

于 2010-06-17T11:44:37.980 に答える
0

このコードは、facebox javascriptがインスタンス化された後、JWplayerを正常にロードします。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;
 })
})
于 2010-06-22T14:11:39.520 に答える