运行 fancybox-thumb 时隐藏其他图片

Question

我想在html页面上隐藏大量图片。在使用 fancybox-thumbnail 显示时，还有其他图像可供查看。目标是让页面看起来干净，而不是被一堆图片弄得乱七八糟。但它不起作用，不确定是否有冲突或这个想法不起作用，我必须在页面上显示其他图像。

头标签：

<link rel="stylesheet" href="js/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="js/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

<script>$(document).ready(function() {
$(".fancybox-thumb").fancybox({
    prevEffect  : 'none',
    nextEffect  : 'none',
    helpers : {
        title   : {
            type: 'outside'
        },
        thumbs  : {
            width   : 50,
            height  : 50
        }
    }
});
});
</script>

正文标签：

<a class="fancybox-thumb" rel="fancybox-thumb" href="images/art/3pk.jpg">
        <div class="imgconcept"></div></a>
<div class="hidden">
    <a class="fancybox-thumb" rel="fancybox-thumb" href="images/art/clcfashnb.jpg"><img src="images/art/clcfashnb.jpg" alt="" /></a>
</div>

Answer 1

编辑：

<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />

<script type="text/javascript" src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>

<link rel="stylesheet" href="js/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />

<script type="text/javascript" src="js/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

<script>$(document).ready(function() {
$(".fancybox-thumb").fancybox({
    prevEffect  : 'none',
    nextEffect  : 'none',
    helpers : {
        title   : {
            type: 'outside'
        },
        thumbs  : {
            width   : 50,
            height  : 50
        }
    }
});
});
</script>

DEMO

问题其实很简单。您缺少缩略图工作的两个重要库。

jquery.fancybox-thumbs.js

jquery.fancybox-thumbs.css

仅此而已。

你的代码很好。

$(".fancybox-thumb").fancybox({
        prevEffect: 'none',
        nextEffect: 'none',
        helpers: {
            title: {
                type: 'outside'
            },
            thumbs: {
                width: 50,
                height: 50
            }
        }
    });

运行 fancybox-thumb 时隐藏其他图片

Hide other images while running fancybox-thumb

html

javascript

jquery

fancybox

编辑：