jquery弹出层Div背景半透明与内容不透明__Body_100%_function_position_alertContent_

当前位置: 编程技术>jquery

jquery弹出层Div背景半透明与内容不透明

来源: 互联网发布时间：2014-10-07

本文导语: 例子，jquery弹出层背景半透明。代码示例: jquery手写弹出层背景半透明，内容不透明 *{ margin:0; padding:0;} .alertDiv,.alertDiv1{ position:fixed; width:100%; height:100%; top:0; color:#fff;} .alertCon,.alertCon1{ position:absolute; width:100%; height...

例子，jquery弹出层背景半透明。

代码示例:

jquery手写弹出层背景半透明，内容不透明

*{ margin:0; padding:0;}
.alertDiv,.alertDiv1{ position:fixed; width:100%; height:100%; top:0; color:#fff;}
.alertCon,.alertCon1{ position:absolute; width:100%; height:100%; text-align:center; margin-top:20%; z-index:999;}
.alertBg,.alertBg1{ position:absolute; width:100%; height:100%; background:#000; opacity:0.7; z-index:99;}
.alertClose,.alertClose1{ position:absolute; width:100%; text-align:right; z-index:9999; color:#f00;}

www.

点击这里弹出Div

/*By Lean*/

这里的内容是不透明的

X关闭X

点击这里弹出另外一个Div

/*By Lean*/

这里的内容是不透明的，这里的内容是另一个div的

X关闭X

$(function(){
/*By Lean*/
alertContent(".clickAlert",".alertDiv",".alertClose");
alertContent(".clickAlert1",".alertDiv1",".alertClose1");

function alertContent(LeanA,LeanB,LeanC){
$(LeanB).hide();
$(LeanA).click(function(){
$(LeanB).fadeIn(200);
})
$(LeanC).click(function(){
$(LeanB).fadeOut(200);
})
}
})

Body内容