Question

我不是webdev，但我试图让Fancybox工作。除了loop：false属性之外，一切正常。图片不会在画廊的尽头停止。

这是我的代码

<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="lib/jquery.mousewheel-3.0.6.pack.js"></script>

<!-- Add fancyBox main JS and CSS files -->
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />



<script type="text/javascript">
    $(document).ready(function() {
        /*
         *  Simple image gallery. Uses default settings
         */

        $('.fancybox').fancybox({'loop': false, });

        /*
         *  Different effects
         */

        // Change title type, overlay closing speed
   /*     $(".fancybox-effects-a").fancybox();*/

        // Disable opening and closing animations, change title type
        $(".fancybox-effects-b").fancybox({
            openEffect: 'none',
            closeEffect: 'none',

        });

        // Set custom style, close if clicked, change title type and overlay color
        $(".fancybox-effects-c").fancybox({
            wrapCSS: 'fancybox-custom',
            closeClick: true,

            openEffect: 'none',


        });
        // Set custom border-width
        $(".fancybox")
            .attr('rel', 'gallery')
            .fancybox({
                padding: 2
            });



    });
</script>
<style type="text/css">
    .fancybox-custom .fancybox-skin {
        box-shadow: 0 0 50px #222;
    }

    body {
        text-align: center;
        max-width: 1250px;
        margin: 0 auto;
    }

    div {
        /*text-align:center;*/
        width: 100%;
    }

    iframe {
        width: 1200px;
    }
</style>

<div>
    <iframe width='800' height='400' frameborder='0' src='/island/island_2015.html' allowfullscreen webkitallowfullscreen mozallowfullscreen oallowfullscreen msallowfullscreen></iframe>
</div>



<h3>Simple image gallery</h3>
<p>
    <a class="fancybox" href="/island/img/photoblog/Image01.JPG" data-fancybox-group="gallery" title=""><img src="/island/img/photoblog/thumbs/Image01.JPG" alt="" /></a>
    <a class="fancybox" href="/island/img/photoblog/Image02.JPG" data-fancybox-group="gallery" title=""><img src="/island/img/photoblog/thumbs/Image02.JPG" alt="" /></a>
    <a class="fancybox" href="/island/img/photoblog/Image03.JPG" data-fancybox-group="gallery" title=""><img src="/island/img/photoblog/thumbs/Image03.JPG" alt="" /></a>
</p>

<p>
    <a href="www.google.com">ZURÜCK</a>
</p>

有没有人知道盒子为什么没有反应？谢谢你的帮助

Answer 1

好的，我明白了。不得不在沙盒中玩一下。我不得不将'loop':false带到代码的这一部分：

        // Set custom border-width
        $(".fancybox")
            .attr('rel', 'gallery')
            .fancybox({
                padding: 2,
                'loop': false
            });

现在作为魅力工作（尽管有一些奇怪的＆＃34;行和＃34;在图片加载时显示）。

由于

Fancybox循环：false不起作用

1 个答案: