html页面js实现页面弹框

1、按钮

新增二级分类

2、弹框内容

	

		关闭
	
	

		
二级分类名称：
		

		

		

	
	

	

		
		
	

3、js部分

//===================================弹框js部分 start by:songfayuan=========================================
//弹出隐藏层
function ShowDiv(show_div,bg_div){
	var scrollHeight = document.body.scrollHeight; //文档高度
	document.getElementById(bg_div).style.height=scrollHeight+'px';
	
	document.getElementById(show_div).style.display='block';
	document.getElementById(bg_div).style.display='block';
};
//关闭弹出层
function CloseDiv(show_div,bg_div)
{
	document.getElementById("label").value = '';
	document.getElementById(show_div).style.display='none';
	document.getElementById(bg_div).style.display='none';
};
//关闭弹出层
function CloseDiv2()
{
	document.getElementById("MyDiv").style.display='none';
	document.getElementById("fade").style.display='none';
};
//===================================弹框js部分 end by:songfayuan=========================================

4、css部分

/* ===================================弹框css部分 start by:songfayuan========================================= */
.black_overlay{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index:1001;
	-moz-opacity: 0.8;
	opacity:.50;
	filter: alpha(opacity=50);
}
.white_content {
    display: none;
    position: absolute;
    top: 35%;
    left: 36%;
    width: 33%;
    border: 2px solid #d3d3d3;
    background-color: white;
    z-index: 1002;
	/* overflow: auto; */
}
.white_content_small {
	display: none;
	position: absolute;
	top: 20%;
	left: 30%;
	width: 40%;
	height: 50%;
	border: 16px solid lightblue;
	background-color: white;
	z-index:1002;
	overflow: auto;
}
/* ===================================弹框css部分 end by:songfayuan========================================= */

5、效果图