0

fancyBox Web サイトのすべてのコード例で、シャドー ボックスは背景コンテンツをロックし、デフォルトでグレー表示します。私はコードを入れないようにしましたが、手動でコードを入れようとしましたが、何をしてもコンテンツをロックしたり、背景コンテンツの不透明度を変更したりしません。これが私のコードとテストページです。テストページ: 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 に答える