0

在 fancyBox 网站上的每一个代码示例中,阴影框默认锁定背景内容并使其变灰。我试过不输入任何代码,也尝试过手动输入代码,无论我做什么,它都不会锁定内容或改变背景内容的不透明度。这是我的代码和测试页面。测试页: http ://docuvital.com/docuvital/includes/themes/merced/templates/guitester.cfm

<!-- Add jQuery library -->
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>

<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript"src="#APP_ROOT#/includes/themes/merced/templates/shadowbox/lib/jquery.mousewheel-3.0.6.pack.js"></script>

<!-- Add fancyBox -->
<link rel="stylesheet" href="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/jquery.fancybox.pack.js?v=2.1.5"></script>

<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>

<link rel="stylesheet" href="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="#APP_ROOT#/includes/themes/merced/templates/shadowbox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>

</head>
</cfoutput>
<body>
this is some test stuff
<script>
$.fancybox.open([
{
  helpers : {

    overlay : {
    locked  : true,
        css : {
            'background' : 'rgba(58, 42, 45, 0.95)'
        }
    }
},
content : 'test',
title: "test page"
}    
]);
</script>
4

1 回答 1

1

您试图在初始化之前打开 Fancybox。您需要放置$.fancybox.open在其中$(document).ready(或至少等到文档加载完毕。

$(document).ready(function () {
    $(".fancybox").fancybox();

    $.fancybox.open([{
        helpers: {

            overlay: {
                locked: true,
                css: {
                    'background': 'rgba(58, 42, 45, 0.95)'
                }
            }
        },
        content: 'test',
        title: "test page"
    }]);
});
于 2013-09-01T11:11:26.787 回答