Comment faire pour afficher une vidéo, et d'ouvrir une lightbox au clic, avec jQuery prettyPhoto?

Je suis en train d'utiliser le prettyPhoto pour jQuery pour ajouter une vidéo sur mon site.

J'ai ajouté le jQuery, le code source et le prettyPhoto js emplacement dans ma tête, et avant la fin de mon corps tag, et j'ai aussi ajouté l'initialisation de code (comme il est dit dans la documentation).

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

Dans mon code HTML, c'est ce que j'ai écrit parce que je voulais la vidéo pour montrer trop, mais quand quelqu'un clique sur la vidéo devrait s'ouvrir comme lightbox.

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

Mais cela ne fonctionne pas. Comment puis-je faire cela?

OriginalL'auteur James | 2011-08-15

  1. 6

    C'est la façon dont vous devriez le faire

    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>

    Pas besoin de vous changer JavaScript.

    De Travail De Démonstration: http://jsfiddle.net/naveen/HU8zx/

    Documentation: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/

    OriginalL'auteur naveen