2014-06-08 4 views
1

J'utilise colorbox dans l'un de mes projets pour créer une galerie vidéo. Et je veux obtenir la description de la vidéo sous chaque vidéo dans le modal de colorbox ouvert. Jusqu'à présent, voici ce que j'ai,Youtube video description on colorbox

<script> 
    $(document).ready(function(){ 
    $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390}); 
    }); 
</script> 

et le html;

<div class="utube-box"> 
<a class='youtube' href="http://www.youtube.com/embed/VOJyrQa_WR4?rel=0&amp;wmode=transparent"><img src="http://img.youtube.com/vi/VOJyrQa_WR4/mqdefault.jpg"></a> 
</div> 

Je ne pouvais pas trouver d'options dans colorbox, toute aide appréciée.

Répondre

2

Colorbox ne gère pas les informations externes, à ma connaissance, vous devez donc vous procurer les informations vous-même et les transmettre. Assez simple avec du jQuery.

Vous aurez probablement envie de nettoyer le CSS un peu, mais cela est l'idée générale: http://jsfiddle.net/aQKHQ/1/

Décomposer le violon:

$(".youtube").each(... Sélectionne tous les liens avec une classe de « youtube » .

var videoID = ... Extrait l'URL de ces liens et filtre l'ID vidéo. Est simplement pour que nous puissions accéder à ce lien sur lequel nous travaillons actuellement dans la partie suivante.

$.getJSON(... Extrait les données JSON de la vidéo provenant de YouTube et appelle Colorbox avec les options appropriées.