データリスト

Question

のHTMLリンク要素とリンクjQueryのライトボックス（）関数に私はDataListコントロールの内側に、このjQueryのライトボックスのプラグインを実装しています：

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

リンクがある場合、私は仕事にこのコードをテストしましたDataListの外側：

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

しかし、 "rel = lightbox"を持つDataList内のリンクをピックアップしているようには見えません。

だから私は周りdigigng行き、ここからいくつかの教訓を取るようにしてみてください。

• Could not find element inside Datalist by ID with JQuery

はこの思い付いたが動作していないよう：

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

何間違えた？

Answer 1

JQuery LightboxとJQuery Fancyboxを試しました。

JQueryライトボックス（上記）は、lightBox（）がClickイベントにバインド/リンクできないという問題を示しているようです。

JQuery Fancyboxは、画像を有効にするためにTWICEをクリックする必要があるという問題を提起しました。また、2枚目の画像は表示されません（同じ1枚目の画像を再度表示します）。

だから最後に、私は代わり規範に対して行って、使用Lightbox2：

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

これで問題はjQueryの$グローバルに宣言されていると$競合しています。だから、いくつかの調査をした後で、この周りに私のヒントがあります。

次のようにスクリプトシーケンス：

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

は、jQueryのスクリプトを持っている必要があります "jQuery.noConflictを（）;"最初の行として。ページで使用されているJQuery $記号はすべて「jQuery」に変更する必要があります。例：

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

これは、jQueryスクリプトと共存するLighboxの使用を可能にしました。

Answer 2

クリック機能にreturn false;を含める必要があると思います。