1

我想在下面的代码中更改一个花哨的框的叠加层和不透明度。我尝试根据 JFK 的建议添加这些行，但不幸的是它不起作用：

   <script type="text/javascript">
$(".fancybox").fancybox({
    helpers : {
        overlay : {
            css : {
                'background' : 'rgba(58, 42, 45, 0.3)'
            }
        }
    }
});

</script>

就在开始脚本标签之后，但没有成功。有什么想法吗？谢谢

我现在的完整代码：

    <script type="text/javascript">
$(".fancybox").fancybox({
    helpers : {
        overlay : {
            css : {
                'background' : 'rgba(58, 42, 45, 0.3)'
            }
        }
    }
});

function openFancybox() {
    setTimeout( function() {$('#various1').trigger('click'); },2000);

}
$(document).ready(function() {
    var visited = $.cookie('visited');
    if (visited == 'yes') {
        return false;
    } else {
        openFancybox();
    }
    $.cookie('visited', 'yes', { expires: 1 });
    $('#various1').fancybox();

});
</script>

在正文标签内：

<div id="various1" style="display:none;">
<h2>Welcome to our website!</h2>
</div>
4

3 回答 3

3

Fancybox v2.x 选项是新的，与以前的版本不兼容……例如overlayOpacity，overlayColor它是 fancybox v1.3.4 的选项，不适用于版本 2。

检查fancybox v2.x 文档以了解您应该使用的正确选项。

要更改 fancybox 2 中的颜色和不透明度，您应该使用这种格式（今天的 v2.1.4）：

$("#various1").fancybox({
    helpers : {
        overlay : {
            css : {
                'background' : 'rgba(58, 42, 45, 0.3)'
            }
        }
    }
});

...选择 4 个数字中的最后一个opacity（编辑：上面的代码与 OP 的选择器匹配）

检查JSFIDDLE

重要提示：IE[6/7/8] 不支持rgba....查看这篇文章以获得进一步的参考。

于 2013-06-08T22:14:48.610 回答
2

只需将您的代码放入

$(function(){
//your code here
})
于 2016-07-28T06:49:11.723 回答
0

尝试

#fancybox-overlay {
  width: 100%;
}
于 2014-04-23T14:46:10.817 回答