0

我的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">
4

1 回答 1

0

如果您希望缩略图“适合”浏览器的宽度，您可以将一些 CSS 元素更改为 100% 的宽度。如果你改变这三个，你就会到达那里。

.center {
    width: 100%;
}

#content {
    width: 100%;
}

.portfolio-container {    
    width: 100%;
}

然后，当您更改浏览器的宽度时，每行将容纳更少或更多的图像。

于 2012-10-02T15:36:34.423 回答