我如何分頁fancybox導航縮略圖

Question

我有很多照片在我fancybox畫廊和縮略圖導航泄漏離開頁面的一面。

所以我想將可見的縮略圖導航分頁到5左右的箭頭或沿着這些線的東西。

我不是最好的js（我正在學習），但我明白html。

http://ryansamul.com/dark/gallery-subject-new.html

以下是我的代碼截斷版本：

<script type="text/javascript"> 
jQuery(document).ready(function() { 
    jQuery(".fancybox-thumb").fancybox({ 
     prevEffect : 'none', 
     nextEffect : 'none', 
     helpers : { 
      title : { 

       type: 'outside' 
      }, 
      thumbs : { 
       width : 100, 
       height : 100 
      } 
     } 
    }); 
}); 
    </script> 


<div class="one-fifth"> 
       <p> 
        <a class="fancybox-thumb" rel="fancybox-thumb" href="images/gallery/subject/1.jpg" ><img src="images/gallery/subject/thumbs/1.png" width="158" height="158" alt=" "/></a> 
       </p> 
      </div> 

      <div class="one-fifth"> 
       <p> 
        <a href="images/gallery/subject/2.jpg" class="fancybox-thumb" rel="fancybox-thumb"><img src="images/gallery/subject/thumbs/2.png" width="158" height="158" alt=" " /></a> 
       </p> 
      </div> 
      <div class="one-fifth"> 
       <p> 
        <a href="images/gallery/subject/3.jpg" class="fancybox-thumb" rel="fancybox-thumb"><img src="images/gallery/subject/thumbs/3.png" width="158" height="158" alt=" " /></a> 
       </p> 
      </div> 
      <div class="one-fifth"> 

Answer 1

如果你希望你的縮略圖只是「適應」在瀏覽器的寬度，你可以改變一些您CSS元素的寬度爲100％。如果你改變這三個，你會到達那裏。

.center { 
    width: 100%; 
} 

#content { 
    width: 100%; 
} 

.portfolio-container {  
    width: 100%; 
} 

然後，當您更改瀏覽器的寬度時，每行將會放入更少或更多的圖像。