2013-08-30 65 views
0

我使用第一個燈箱系統。我選擇了fancybox。但是,我有一個問題。點擊後選擇我的畫廊的圖像,隱藏的圖像。Fancybox圖像隱藏後點擊

這是我的所有代碼;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 
    <title>FancyBox Gallery Test</title> 

    <link rel="stylesheet" href="inc/css/style.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/jquery.fancybox.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-buttons.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-thumbs.css" /> 
    <script type="text/javascript" src="inc/js/jquery.js"></script> 
    <script type="text/javascript" src="inc/js/jquery.mousewheel.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/jquery.fancybox.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-buttons.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-media.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-thumbs.js"></script> 
</head> 
<body> 

    <div class="gallery"> 
     <center> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 

       for(var i = 0;i<9;i++){ 
        $(".gallery li#"+i).fancybox({ 
         padding: 0, 
         'hideOnContentClick': false, 
         openEffect : 'elastic', 
         openSpeed : 150, 

         closeEffect : 'elastic', 
         closeSpeed : 150, 

         closeClick : true, 

         helpers : { 
          overlay : null 
         } 
        }); 
       } 
      }); 
     </script> 
     <ul> 
      <li id="1"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="123123123" /></li> 
      <li id="2"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="3"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="4"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="5"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="6"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="7"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
      <li id="8"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li> 
     </ul> 
     </center> 
    </div> 
</body> 
</html> 

我們該如何解決?因爲,我看不出錯。

謝謝您的關注。 好作品..

回答

0

我希望我明白,你的問題是什麼。我把它清理了一下,我希望我解決了你的問題:)

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 
    <title>FancyBox Gallery Test</title> 

    <link rel="stylesheet" href="inc/css/style.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/jquery.fancybox.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-buttons.css" /> 
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-thumbs.css" /> 
</head> 
<body> 

    <div class="gallery" style="text-align:center;"> 
     <ul> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 1: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 2: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 3: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 4: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 5: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 6: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 7: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
      <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 8: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li> 
     </ul> 
    </div> 

    <script type="text/javascript" src="inc/js/jquery.js"></script> 
    <script type="text/javascript" src="inc/js/jquery.mousewheel.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/jquery.fancybox.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-buttons.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-media.js"></script> 
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-thumbs.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 

      $(".fancybox").fancybox({ 
       padding: 0, 
       openEffect : 'elastic', 
       openSpeed : 150, 

       closeEffect : 'elastic', 
       closeSpeed : 150, 

       closeClick : false, 

       helpers : { 
        overlay : null 
       } 
      }); 
     }); 
    </script> 
</body> 
</html> 
+0

如果你提供的答案,你應該寫你改變了。沒有人看到,你改變了什麼 –