有沒有什麼辦法可以在Magento上調試Lightbox2 1411

Question

我想在view.phtml上使用Lightbox2。我已經包含「lightbox.js」和「lightbox.css」。我正在使用jQuery 1.8.2。 jQuery在「lightbox.js」之前被調用。我可以看到這些文件已經包含在我看看主頁代碼時，我可以下載「lightbox.js」和「lightbox.css」代碼。

當我點擊lightbox鏈接時，它會在新頁面中顯示第一張圖片，而不是在彈出窗口內彈出圖片。

任何線索？

謝謝

Answer 1

我用下面的代碼

 <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-3.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-3.jpg" alt=""/></a> 
     <a class="example-image-link" visibility: hidden href="http://lokeshdhakar.com/projects/lightbox2/images/image-4.jpg" data-lightbox="example-set" data-title="Or press the right arrow on your keyboard."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-4.jpg" alt="" /></a> 
     <a class="example-image-link" visibility: hidden href="http://lokeshdhakar.com/projects/lightbox2/images/image-5.jpg" data-lightbox="example-set" data-title="The next image in the set is preloaded as you're viewing."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-5.jpg" alt="" /></a> 
     <a class="example-image-link" visibility: hidden href="http://lokeshdhakar.com/projects/lightbox2/images/image-6.jpg" data-lightbox="example-set" data-title="Click anywhere outside the image or the X to the right to close."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-6.jpg" alt="" /></a> 

首頁標題

<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/js/calendar/calendar-win2k-1.css" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/css/styles.css" media="all" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/css/styles-th-lpf.css" media="all" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/css/adpopup-pro.min.css" media="all" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/css/lightbox.css" media="all" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/base/default/css/widgets.css" media="all" /> 
<link rel="stylesheet" type="text/css" href="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/default/css/print.css" media="print" /> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/prototype/prototype.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/lib/ccard.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/prototype/validation.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/scriptaculous/builder.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/scriptaculous/effects.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/scriptaculous/dragdrop.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/scriptaculous/controls.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/scriptaculous/slider.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/varien/js.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/varien/form.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/varien/menu.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/mage/translate.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/mage/cookies.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/varien/product.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/calendar/calendar.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/calendar/calendar-setup.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/js/varien/weee.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/jquery.1.8.2.noConflict.min.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/jquery.jcarousel.min.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/jquery.sliderTE-min.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/adpopup-pro.min.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/lightbox.js"></script> 
<script type="text/javascript" src="http://staging.lapetiteflute.com/skin/frontend/interface_lpf_fr/theme_lpf/js/general.js"></script>