2011-12-29 123 views
0

我需要你的幫助。 是否有可能使用fancybox作爲沒有YouTube的電影播放器​​?只是讀取服務器上的文件並顯示它?fancybox電影上播放www

那花哨的YouTube腳本:

<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/觀看?= Psk2Pq03rv0 & fs = 1「>任意文本</a>'

我可以更改它不使用YT,但默認播放器嗎?

回答

1

事實上,你將永遠需要一名球員。 Fancybox不能用作「本身」播放器,但是您可以使用YouTube默認播放器以外的其他播放器,例如JWPlayer。

JwPlayer支持,因爲4.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視頻默認的YouTube播放器喜歡:

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

現在,使用相同的嵌入技術上面提到的,你可以調整你的fancybox腳本中使用jwplayer發揮你的錨這樣的href指定的YouTube視頻:

使用HTML:

<a class="video" href="http://www.youtube.com/watch?v=DdR41fe9Zeg" title="test">Arbitrary text</a> 

(注意,我刪除了類iframe ......這是沒有必要的)

使用編輯的腳本:

<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> 

請注意,我用的是API OPTI 'content'而不是'href'將視頻嵌入到fancybox中,但我仍然使用href將URL轉換爲其簡化版本。

最後,我假設你正在使用fancybox v1.3.x,因爲你正在使用的選項,所以腳本只能使用該版本。