模拟alert封装自定义提示框，1秒后自动消失代码,JS代码库,德仔网

代码语言

代码分类

【JS】模拟alert封装自定义提示框，1秒后自动消失

作者:wang198689jian / 发布于2014/7/2/ 583


	//消息框
	function alert(str,caption){
	 this.disappear=function(){
	$("#bgdiv").remove();
	$("#msgdiv").remove();
	$("#msgtitle").remove();
	msgobj=null;
	msgdiv=null;
	};
	disappear();
	 this.m_text=str;
	 this.m_caption=caption;
	 this.m_width=200;
	 this.m_height=100;
	 this.m_wait=1000;
	 this.m_fade=500;
	 this.m_bordercolor="#336699";
	 this.m_titlecolor="#99ccff";
	 var msgw,msgh,bordercolor;
	 msgw=m_width;//提示窗口的宽度
	 msgh=m_height;//提示窗口的高度
	 titleheight=25 //提示窗口标题高度
	 bordercolor=m_bordercolor;//提示窗口的边框颜色
	 titlecolor=m_titlecolor;//提示窗口的标题颜色
	
	 var swidth,sheight;
	 swidth=document.body.offsetWidth;
	 sheight=document.body.offsetHeight;
	 if (sheight<screen.height)
	 {
	 sheight=screen.height;
	 }
	 // //此处可以添加一个背景，防止多次点击保存按钮
	 // if(bgobj==undefined){
	 // var bgobj=document.createElement("div");
	 // }
	 // bgobj.setAttribute('id','bgdiv');
	 // bgobj.style.position="absolute";
	 // bgobj.style.top="0";
	 // bgobj.style.background="#777";
	 // bgobj.style.filter="progid:dximagetransform.microsoft.alpha(style=3,opacity=25,finishopacity=75";
	 // bgobj.style.opacity="0.6";
	 // bgobj.style.left="0";
	 // bgobj.style.width=swidth + "px";
	 // bgobj.style.height=sheight + "px";
	 // bgobj.style.zindex = "10000";
	 // document.body.appendChild(bgobj);
	 if(msgobj==null){
	 var msgobj=document.createElement("div");
	 }
	 msgobj.setAttribute("id","msgdiv");
	 msgobj.setAttribute("align","center");
	 msgobj.style.background="white";
	 msgobj.style.border="1px solid " + bordercolor;
	 msgobj.style.position = "absolute";
	msgobj.style.left = "50%";
	msgobj.style.top = "50%";
	msgobj.style.font="12px/1.6em verdana, geneva, arial, helvetica, sans-serif";
	 msgobj.style.marginLeft = "-115px" ;
	msgobj.style.marginTop = -115+document.documentElement.scrollTop+"px";
	msgobj.style.width = msgw + "px";
	msgobj.style.height =msgh + "px";
	msgobj.style.textAlign = "center";
	msgobj.style.lineHeight = (msgh-titleheight) + "px";
	msgobj.style.zIndex = "10001";
	if(title==null){
	 var title=document.createElement("h4");
	}
	 title.setAttribute("id","msgtitle");
	 title.setAttribute("align","left");
	 title.style.margin="0";
	 title.style.padding="3px";
	 title.style.background=bordercolor;
	 title.style.filter="progid:dximagetransform.microsoft.alpha(startx=20, starty=20, finishx=100, finishy=100,style=1,opacity=75,finishopacity=100);";
	 title.style.opacity="0.75";
	 title.style.border="1px solid " + bordercolor;
	 title.style.height="18px";
	 title.style.font="12px verdana, geneva, arial, helvetica, sans-serif";
	 title.style.color="white";
	 title.style.cursor="pointer";
	 title.innerHTML="消息提示";
	 title.onclick=function(){
	 disappear();
	 }
	document.body.appendChild(msgobj);
	document.getElementById("msgdiv").appendChild(title);
	var txt=document.createElement("p");
	txt.style.margin="1em 0"
	txt.setAttribute("id","msgtxt");
	txt.innerHTML=str;
	 document.getElementById("msgdiv").appendChild(txt);

	

	this.fadeout=function(){
	 $("#bgdiv").fadeOut(1000);
	$("#msgdiv").fadeOut(1000);
	$("#msgtitle").fadeOut(1000,function(){disappear()});
	}
	setTimeout("fadeout()",500);
	};

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　自定义提示框　　 alert　

同语言下

可能有用的

wang198689jian贡献的其它代码(5)