javascript 覆盖不工作fancybox v2
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17004054/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Overlay not working fancybox v2
提问by Greg
I'd like to change the overlay and opacity of a fancy box in the code below. I tried to add these lines based on JFK's suggestions but unfortunately it is not working:
我想在下面的代码中更改一个漂亮框的覆盖和不透明度。我试图根据肯尼迪的建议添加这些行,但不幸的是它不起作用:
<script type="text/javascript">
$(".fancybox").fancybox({
helpers : {
overlay : {
css : {
'background' : 'rgba(58, 42, 45, 0.3)'
}
}
}
});
</script>
just after the opening script tag but without success. Any thoughts? Thanks
就在打开脚本标签之后,但没有成功。有什么想法吗?谢谢
My full code now:
我现在的完整代码:
<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>
Within body tags:
在身体标签内:
<div id="various1" style="display:none;">
<h2>Welcome to our website!</h2>
</div>
回答by JFK
Fancybox v2.x options are new and not compatible with previous versions ... for instance overlayOpacity
and overlayColor
are options for fancybox v1.3.4 and won't work with version 2.
Fancybox v2.x 选项是新的,与以前的版本不兼容……例如overlayOpacity
,overlayColor
是fancybox v1.3.4 的选项,不适用于版本 2。
Check fancybox v2.x documentationfor the right options you should be using.
检查fancybox v2.x 文档以了解您应该使用的正确选项。
To change color and opacity in fancybox 2, you should use this format (v2.1.4 as today) :
要更改fancybox 2 中的颜色和不透明度,您应该使用这种格式(今天的v2.1.4):
$("#various1").fancybox({
helpers : {
overlay : {
css : {
'background' : 'rgba(58, 42, 45, 0.3)'
}
}
}
});
...where the last of the 4 numbers is the selected opacity
(EDIT: the code above matches the OP's selector)
...其中 4 个数字中的最后一个被选中opacity
(编辑:上面的代码与 OP 的选择器匹配)
Check JSFIDDLE
检查JSFIDDLE
IMPORTANT: IE[6/7/8] doesn't support rgba
.... check this articlefor further reference.
重要提示:IE[6/7/8] 不支持rgba
.... 查看这篇文章以获取进一步参考。
回答by Rahul Sawant
Just put your code in
把你的代码放进去
$(function(){
//your code here
})
回答by comonitos
Try
尝试
#fancybox-overlay {
width: 100%;
}