Question

我正在使用Fancybox，因此用户可以点击图片缩略图并查看更大的图片。

我遇到的问题是，当页面加载时它并不总是有效。我将点击缩略图，而Fancybox不会显示较大的图像。如果我刷新页面，它工作得很好。内容是动态生成的，所以我想知道我是否需要刷新DOM？

    <script type="text/javascript">
        $(document).ready(function() {
            $(".fancybox").fancybox({
                openEffect  : 'fade', // openEffect / closeEffect / nextEffect / prevEffect 
                closeEffect : 'fade', // Animation effect ('elastic', 'fade' or 'none') for each transition type
                nextEffect  : 'fade', // String; Default value: 'fade', 'fade', 'elastic', 'elastic'
                prevEffect  : 'fade',
                openSpeed   : '1000', // openSpeed / closeSpeed / nextSpeed / prevSpeed     
                closeSpeed  : '1000', // The time it takes (in ms, or "slow", "normal", "fast") to complete transition
                nextSpeed   : '1000', // Integer; Default value: 250
                prevSpeed   : '1000',
                padding     : 3
            });
        });
    </script>

<a class='fancybox' rel='gallery' href='".$data['photo'][$x]."'><img src='".$data['photo'][$y]."' style='margin-right: 2.5px; margin-left: 2.5px; vertical-align: top;'></a>

当它不起作用时我点击了缩略图，这是我得到的错误......

第15行的jquery.fancybox.pack.js中的

TypeError: a[0] is undefined。

以下是我如何调用Fancybox，也许这就是问题？

<script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js?v=2.1.4"></script>

我不关心我使用哪个版本的fancybox，只要我在这里获得功能以及在另一个页面上我有一个显示页面加载时的Fancybox。

Answer 1

如果您在同一页面上有多个图像，而不是像上面那样调用，则可以使用

$("a[rel=gallery]").fancybox({
     openEffect  : 'fade', // openEffect / closeEffect / nextEffect / prevEffect 
            closeEffect : 'fade', // Animation effect ('elastic', 'fade' or 'none') for each transition type
            nextEffect  : 'fade', // String; Default value: 'fade', 'fade', 'elastic', 'elastic'
            prevEffect  : 'fade',
            openSpeed   : '1000', // openSpeed / closeSpeed / nextSpeed / prevSpeed     
            closeSpeed  : '1000', // The time it takes (in ms, or "slow", "normal", "fast") to complete transition
            nextSpeed   : '1000', // Integer; Default value: 250
            prevSpeed   : '1000',
            padding     : 3
});

Fancybox有时只在不刷新页面的情况下工作

1 个答案: