利用js对象弹出一个层

168 阅读 0 评论 111 点赞

我是靠谱客的博主友好寒风，最近开发中收集的这篇文章主要介绍利用js对象弹出一个层，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
<title>脚本之家-弹出一个层</title>  
<script language="javascript">  
function cmsgbox(vtitle,vwidth,vhight,vtop,vleft)  
{  
 this.title=vtitle;  
 this.width=vwidth;  
 this.height=vhight;  
 this.top=vtop;  
 this.left=vleft;  
 this.id=0;  
}  
cmsgbox.prototype.showdiv=function()  
{  
 var str="";  
 str+="<div id='div1' style='z-index:1;background-color:white;position:absolute;border:2px solid slategray;left:"+this.vleft+"px;top:"+this.vtop+"px;width:"+this.width+"px;'>";  

 str+="<div style='padding-bottom:2px;background-color:slategray;width:100%;height:16px;color:white;' >";  
 str+=" <div style='float:left;height:16px;overflow:hidden;margin:0px;padding:4px 0px 0px 5px;width:"+(parseInt(this.width)-24*2-5)+"px;'>"+this.title+"</div>";  
 str+=" <span style='width:14px;font-family:webdings;cursor:hand;'>0</span>";  
 str+=" <span style='width:14px;font-family:webdings;cursor:hand;'  onclick='cmsgbox.closediv(this);'>r</span>";  
 str+="</div>";  

 str+="<div style=' margin:10px 5px 10px 10px;word-break:break-all;'>";  
 str+="xxx";  
 str+="</div>";  
 str+="</div>";  
 //document.write(str);  
 document.body.insertAdjacentHTML("beforeEnd",str);  
}  
/////////////////////窗口显示//////////////////////////////  
function show()  
{  
 var box=new cmsgbox('小家伙呀',400,300);  
 box.showdiv();  
}  
</script>  
</head>  

<style>  
body{  
 font-size:12px;  
}  
</style>  
<body>  
<p onclick="show();">弹了一个层</p>  
</body>  
</html> 