Question

我正在使用FancyBox插件为我的图片获取一个漂亮的图库查看器。我的索引页面上显示的是图像，但是当我点击它们时，fancybox会显示所需图像的正确尺寸，但没有图像。甚至没有损坏的图像路径符号，只是一个空白，好像它的显示只是关闭。我的html如下，

<a class="fancybox" rel="fancybox-thumb" href="unveil1.jpg" title="Title">
    <img src="img/loading.gif" data-src="unveil1.jpg"/>
</a> 
<a class="fancybox" rel="fancybox-thumb" href="img/unveil2.jpg" title="Title">
    <img src="img/loading.gif" data-src="img/unveil2.jpg"/>
 </a>

虽然我的js是：

$(document).ready(function() {
 $(".fancybox").fancybox({
    prevEffect  : 'none',
    nextEffect  : 'none',
    helpers : {
        title   : {
            type: 'outside'
        }

    }
 });

 $("img").unveil(200, function() {
    $(this).load(function() {
        this.style.opacity = 1;
    });
 });
});

你可以忽略unveil插件，它所做的只是延迟加载图片而且我已经尝试将其取出并且我仍然遇到同样的问题。如果JSFiddles外部库我遇到了麻烦，所以这里是link to my dropbox

谢谢你们！

Answer 1

找出问题所在。我正在设置一个过渡，使用unveil从不透明度0开始并从那里过渡。这是设置我的图像时单击不转换并保持不透明度0！

FancyBox一旦点击就不显示图像

1 个答案: