2011-12-29 10 views
0

私はあなたの助けが必要です。 youtubeなしで映画プレーヤーとしてfancyboxを使用することはできますか?サーバー上のファイルを読み込んで表示するだけですか?ファンシーボックスのムービーをwww再生します。

<script> 
    $(document).ready(function(){ 
     $("a.video").click(function() { 
      $.fancybox({ 
        'padding' : 0, 
        'autoScale' : false, 
        'title' : this.title, 
        'overlayOpacity' : '.6', 
        'overlayColor' : '#333', 
        'transitionIn' : 'none', 
        'transitionOut' : 'none', 
        'centerOnScroll' : false, 
        'showCloseButton' : true, 
        'hideOnOverlayClick': false, 
        'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
        'type' : 'swf', 
        'swf' : { 
        'wmode': 'transparent', 
        'allowfullscreen': 'true' 
        } 
      }); 
      return false; 
     }); 
    }); 
</script> 
  • HTML::

「<クラス= "ビデオはiframe" のhref = "http://www.youtube.com/

は空想ユーチューブのためのスクリプトのthats時計?= Psk2Pq03rv0 & fs = 1 ">任意のテキスト</a> '

私はYTではなくデフォルトプレーヤーを使用するように変更できますか?

答えて

1

実際には、常にプレーヤーが必要です。ファンシーボックスは "それ自体"プレーヤーとしては使用できませんが、例えばJWPlayerのようなYouTubeのデフォルトプレーヤー以外のプレーヤーを使用することもできます。

JwPlayerは、以下のオプションが有効になるようv4.xのため、YouTubeの動画を再生するためにサポートしています。

pathToPlayer/jwplayer.swf?file=http://www.youtube.com/watch?v=DdR41fe9Zeg 

または

pathToPlayer/jwplayer.swf?file=http://www.youtube.com/v/DdR41fe9Zeg 

ので、簡単にjwplayerを使用しての代わりに、ウェブページ上のユーチューブのビデオを埋め込むことができますデフォルトのyoutubeプレーヤーのような:

<embed src="pathToPlayer/jwplayer.swf?file=http://www.youtube.com/watch?v=DdR41fe9Zeg" type="application/x-shockwave-flash" width="640" height="376" /> 

今、同じ埋め込み

HTMLを使用して::テクニックは、あなたがそうあなたのアンカーのhrefに指定されたユーチューブの動画を再生するにはjwplayer使用するようにfancyboxスクリプトを微調整することが、上記の

<a class="video" href="http://www.youtube.com/watch?v=DdR41fe9Zeg" title="test">Arbitrary text</a> 
私はクラスを削除

(予告iframe ...それは必要ではないです)

編集したスクリプトを使用します私はAPI OPTIを使用しています

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("a.video").click(function() { 
    $.fancybox({ 
    'padding' : 0, 
    'autoScale' : false, 
    'title' : this.title, 
    'overlayOpacity' : '.6', 
    'overlayColor' : '#333', 
    'transitionIn' : 'none', 
    'transitionOut' : 'none', 
    'centerOnScroll' : false, 
    'showCloseButton' : true, 
    'hideOnOverlayClick': false, 
    'content': '<embed src="jwplayer.swf?file='+(this.href.replace(new RegExp("watch\\?v=", "i"), "v/"))+'&amp;autostart=true&amp;fs=1" type="application/x-shockwave-flash" width="640" height="376" wmode="opaque" allowfullscreen="true" allowscriptaccess="always"></embed>' 

    // don't need the following lines 
    /* 
    'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
    'type' : 'swf', 
    'swf' : { 
    'wmode': 'transparent', 
    'allowfullscreen': 'true' 
    } // swf 
    */ 

    }); // fancybox 
    return false; 
    }); // click 
}); // ready 
</script> 

お知らせfancyboxに動画を埋め込むには 'href'の代わりに 'content'を入力してください。ただし、まだhrefを使用してURLを簡易版に変換しています。

最後に、使用しているオプションがそのバージョンだけで動作するため、fancybox v1.3.xを使用していると仮定しています。

関連する問題