fonction lien JQuery Lightbox() avec des éléments de lien HTML dans Datalist

Question

Je suis en œuvre ce plugin Lightbox JQuery dans un DataList:

• http://leandrovieira.com/projects/jquery/lightbox/

J'ai testé ce code fonctionne si le lien est en dehors du DataList:

$('a[@rel*=lightbox]').lightBox(); 

Mais il ne semble pas ramasser les liens à l'intérieur du DataList qui a « rel = lightbox ».

Alors je suis allé digigng et essayer de prendre quelques leçons d'ici:

• Could not find element inside Datalist by ID with JQuery

est venu avec cela, mais ne semble pas fonctionner:

  $('a.imageActivator').live("click", function() { 
       jQuery.lightBox(); 
      }); 

Qu'est-ce que s'est mal passé?

Answer 1

J'ai essayé JQuery Lightbox et JQuery Fancybox.

JQuery Lightbox (comme ci-dessus) semble présenter le problème que lightBox() ne peut pas être lié/lié à l'événement Click.

JQuery Fancybox a présenté le problème de devoir cliquer deux fois pour activer l'image. Et il ne montre pas non plus la 2ème image (mais montre encore la même 1ère image).

Donc à la fin, je suis allé contre la norme et utilisé Lightbox2 à la place:

• http://www.lokeshdhakar.com/projects/lightbox2/

Le problème avec ce sont les conflits $ avec JQuery de $ qui est déclarée à l'échelle mondiale. Alors voici mon conseil après avoir fait quelques recherches.

séquence des scripts comme suit:

<script type="text/javascript" src="/scripts/prototype.js"></script> 
<script type="text/javascript" src="/scripts/scriptaculous.js?load=effects,builder"></script> 
<script type="text/javascript" src="/scripts/lightbox.js"></script> 

<script type="text/javascript" src="/scripts/jquery-1.4.2.js"></script> 

de script JQuery devront avoir "jQuery.noConflict();" comme la première ligne. Tout signe $ JQuery utilisé sur la page devra être changé en "jQuery". Par exemple:

<script type="text/javascript"> 
     jQuery.noConflict(); 

     jQuery(function() { 
      jQuery('a.activator').live("click", function() { 
       jQuery('#enquireOverlay').fadeIn('fast', function() { 
        jQuery('#box').animate({ 'top': '160px' }, 500); 
       }); 
      }); 

      jQuery('#boxclose').click(function() { 
       jQuery('#box').animate({ 'top': '-200px' }, 500, function() { 
        jQuery('#enquireOverlay').fadeOut('fast'); 
       }); 
      }); 
     }); 
    </script> 

C'est ce qui m'a permis d'utiliser un Lighbox qui fonctionne, qui co-existe avec des scripts jQuery.

Answer 2

Je pense que vous devez inclure un return false; dans votre fonction de clic.