jQuery prettyPhotoを使用してビデオを表示し、ライトボックスでクリックするとどうなりますか？

Question

jQueryのprettyPhotoを使用して、自分のWebサイトにビデオを追加しようとしています。

jQueryのソースコードとprettyPhoto jsの場所を私の頭の中に入れ、私のbodyタグの終わりの前に追加しました。また、初期化コードも追加しました。私のHTMLで

<script type="text/javascript" charset="utf-8"> 
     $(document).ready(function(){ 
     $("a[rel^='prettyPhoto']").prettyPhoto(); 
     }); 
    </script> 

、これは私がビデオがあまりにも見せたかったので、私が書いたもので、誰かがそれをクリックするとビデオがライトボックスとして開く必要があります。

<div id="video_player"> 
<a href="#" rel="prettyPhoto"> 
<iframe width="640" height="350" src="http://www.youtube.com/embed/cH6kxtzovew" frameborder="0" allowfullscreen></iframe> 
</a> 
</div> 

しかし、動作しません。これをどうやって起こさせるのですか？

Answer 1

これは、あなたがそれを

HTML

<div id="video_player"> 
    <a href="http://www.youtube.com/watch?v=cH6kxtzovew" rel="prettyPhoto" title="My YouTube Video"> 
     <img src="http://img.youtube.com/vi/cH6kxtzovew/default.jpg" alt="YouTube" width="50"> 
    </a> 
</div> 

JavaScriptがすべてであなたを変更する必要はありませんを行う必要があります方法です。

ワーキングデモ：http://jsfiddle.net/naveen/HU8zx/
ドキュメント：http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/