没有显示真实的图片

Question

我已经建立了一个灯箱来展示我的大图像。我有4张图片，但是当我点击数字1时，它会显示数字2，而当我点击数字2时，它也会显示数字2.换句话说，它只会显示数字2图像，而不是其他图像。

jQuery的位置：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script type="text/javascript"> 

     $(document).ready(function(){ 

      $('.lightbox').click(function(){ 
       $('.backdrop, .box').animate({'opacity':'.50'}, 300, 'linear'); 
       $('.box').animate({'opacity':'1.00'}, 300, 'linear'); 
       $('.backdrop, .box').css('display', 'block'); 
      }); 

      $('.close').click(function(){ 
       close_box(); 
      }); 

      $('.backdrop').click(function(){ 
       close_box(); 
      }); 

     }); 

     function close_box() 
     { 
      $('.backdrop, .box').animate({'opacity':'0'}, 300, 'linear', function(){ 
       $('.backdrop, .box').css('display', 'none'); 
      }); 
     } 

    </script> 

当我想看到我的照片，所以我不喜欢这样，只看到他们：

function gallery() 
    { 
     if ($stmt = $this->mysqli->prepare('SELECT `rank`, `img`, `navn` FROM `gallery`')) { 
      $stmt->execute(); 

      /* Bind resultatet */ 
      $stmt->bind_result($rank, $img, $navn); 

      /* Hent rækker og udskriv data */ 
      while ($stmt->fetch()) { 
      if($rank != 1) 
      { 
      ?> 
      <a href="#" class="lightbox"><img src="/indhold/gallery/<?php echo $img;?>" alt="<?php echo $navn;?>"></a> 

      <div class="backdrop"></div> 
      <div class="box"><div class="close">x</div><img src="/indhold/gallery/index/<?php echo $img;?>" alt="<?php echo $navn;?>"></div> 
      <?php 
      } 
      } 

      /* Luk statement */ 
      $stmt->close(); 

     } else { 
      /* Der er opstået en fejl */ 
      echo 'Der opstod en fejl i erklæringen: ' . $this->mysqli->error; 
     } 
     } 
.backdrop { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 100%; 
    height: 100%; 
    background: #000; 
    opacity: .0; 
    filter: alpha(opacity= 0); 
    z-index: 50; 
    display: none; 
} 
.box { 
    position: absolute; 
    top: 20%; 
    left: 30%; 
    height: 175px; 
    width: 370px; 
    background: #fff; 
    z-index: 51; 
    padding: 10px; 
    display: none; 
} 
.close 
{ 
    float: right; 
    margin-right: 10px; 
    margin-bottom: 20px; 
    cursor: pointer; 
} 

Answer 1

对不起的人，看着你的网站后，我不知道知道你想要做什么。我会使用jQuery的内置对话框或获取一个lightbox插件。要么或者只是下载免费的图片库（谷歌搜索“免费的jquery图片库”）。这会容易很多。 :)