Question

我以前成功使用过fancybox，但是根据我的最新设计，fancybox导致滚动条出现，即点击图像，图像显示在窗口中间，窗口本身得到滚动条，它没有用来拥有。当我更改窗口大小或字体大小时，我的布局是流畅的并进行调整。然后，使用fancybox，整个页面移动和重新调整，没有明显的原因，看起来很糟糕，也使用处理器能力。

这可能是什么原因？

此外，背景无法变暗...... fancybox通常会做什么，以及为什么它会因我的设计而失败？

以下是一些代码段：

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
$('.fancybox').fancybox();
});
</script>

<div id="wrapper">
<div id="classes" class="post">
<h2>料理教室・ワークショップ</h2>
<a class="fancybox" rel="classes" href="http://127.0.0.1/wordpress/wp-content/themes/hitomiskuche/images/classes/1.jpg">フォトス</a>
<a class="fancybox" rel="classes" href="http://127.0.0.1/wordpress/wp-content/themes/hitomiskuche/images/classes/2.jpg"></a>
<a class="fancybox" rel="classes" href="http://127.0.0.1/wordpress/wp-content/themes/hitomiskuche/images/classes/3.jpg"></a>
</div>
</div>

#classes {
    width:40%;
    position:absolute;
    left:5%;
    bottom:10%;
    background-color:#fff;
    padding:1em;
    opacity:0.65;
    box-shadow:2px 2px 3px #555;
}

Answer 1

试试这个：

$(".fancybox").fancybox({
    helpers : {
        overlay : {
            locked : false
        }
    }
});

如果您使用的是“超大尺寸”等全屏幕背景，您可能还想将其添加到网页的CSS中：

html {overflow: -moz-scrollbars-vertical; overflow: scroll;}

Answer 2

正如Rob和Eva所回答的那样，将帮助代码添加到java脚本conf对我来说是

这是我的完整代码

        $(document).ready(function() {
            $(".fancybox").fancybox({
                maxWidth        : 800,
                maxHeight   : 500,
                fitToView       : true,
                width       : '100%',
                height      : '100%',
                autoSize        : true,
                closeClick      : true,
                openEffect  : 'elastic',
                closeEffect : 'elastic',
                helpers : {
                overlay : {
                    locked : false
                }
            }

            });
        });

Answer 3

Fancybox使用班级fancybox-overlay来显示叠加层：

.fancybox-lock .fancybox-overlay {
    overflow: auto;
    overflow-y: scroll;
}

overflow-y:scroll属性正在显示滚动条。拿出来你会被分类。

此外，您可能没有将fancybox_overlay.png包含在与fancybox css文件相同的文件夹中。叠加背景是从此文件创建的。希望这些信息有所帮助

Fancybox会导致滚动条出现

3 个答案: