0

我正在使用 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>

当它不起作用并且我单击缩略图时,这是我得到的错误...

TypeError: a[0] is undefined在第 15 行的 jquery.fancybox.pack.js 中。

这就是我如何称呼 Fancybox,也许这就是问题所在?

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

我不在乎我使用的是哪个版本的 fancybox,只要我在这里以及在另一个页面上都有一个 Fancybox 显示页面加载时的功能。

4

1 回答 1

0

如果您在同一页面上有多个具有相同类的图像而不是像上面那样调用,您可以使用

$("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
});
于 2013-03-26T04:32:39.830 回答