(JQuery) Fancybox Start nur mit Klassen?

Question

Ich versuche, eine Videoliste mit Thumbnails arbeiten mit Fancybox zu bekommen - das Problem ist, dass es scheint, dass jeder Link Klassen verwendet, um die Fancybox zu starten

Was ist, wenn ich möchte, dass dies dynamischer wird, eine Liste von Videos Links und jeder öffnet ein neues Video? Ich sollte nicht eine neue Click Function Definition für jeden einzelnen tun müssen?

<script type="text/javascript"> 

    $(document).ready(function() { 

$ (“fancyvideo5" .) Klicken (function() {$ .fancybox ({ 'padding':. 0, 'overlayOpacity': 0,7, 'autoDimensions': false, ' Inhalt ':' myConent ', ' onComplete ': function() {$ ("# fancybox-intern"). css ({' overflow ':' versteckt '});}, ' onClosed ': function() { $ ("# fancybox-inner"). leer();} }); return false; }); // fancyvideo

und der Körper so etwas wie haben:

<ul> 

    <li> 
     <a title="test" href="javascript:;" class="fancyvideo5"><img src="thumbnail.jpg" /></a> 
    </li>                    

</ul> 

id so etwas wie

<a title="test" href="javascript:openVideo(1);" class="fancyvideo5"><img src="thumbnail.jpg" /></a> 

i die Videoinformationen übergeben kann, so haben möchte und die Funktion statt alles nennen auf dem Dokument bereit.

Dank

Answer 1

Ich habe nicht fancybox in eine Weile benutzt, aber wenn ich mich richtig erinnere können Sie eine fancybox-Funktion verwenden.

$(document).ready(function() { 
    $(a.fancyvideo).fancybox(
     //settings 
)); 

Dann wird für Sie Links

<a href="#video" class="fancyvideo" /> 
<a href="#video2" class="fancyvideo" /> 
<a href="#video3" class="fancyvideo" /> 
<a href="#video4" class="fancyvideo" /> 

und

<div id="video" style="display: none;"> 
//insert embed code here 
</div> 
<div id="video2" style="display: none;"> 
//insert embed code here 
</div> 

<div id="video3" style="display: none;"> 
//insert embed code here 
</div> 

<div id="video4" style="display: none;"> 
//insert embed code here 
</div>