<!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>腳本之家-彈出一個(gè)層</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();">彈了一個(gè)層</p>  
</body>  
</html> 

js對(duì)象彈出一個(gè)層

相關(guān)文章

分享十三個(gè)最佳JavaScript數(shù)據(jù)網(wǎng)格庫(kù)
數(shù)據(jù)網(wǎng)格可以幫助解決在 HTML 表格上對(duì)帶有過(guò)濾、分頁(yè)、排序、搜索以及內(nèi)聯(lián)編輯這些功能特性的大量數(shù)據(jù)集的處理問(wèn)題,需要的朋友可以參考下
2017-04-04
JavaScript實(shí)現(xiàn)九宮格移動(dòng)拼圖游戲
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)九宮格移動(dòng)拼圖游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-08-08
"好玩的放大鏡效果" 的另一種實(shí)現(xiàn)方法
"好玩的放大鏡效果" 的另一種實(shí)現(xiàn)方法...
2006-11-11
js鼠標(biāo)、鍵盤事件實(shí)例代碼
js 鼠標(biāo)、鍵盤的幾個(gè)事件的例子
2008-07-07
利用d3.js制作連線動(dòng)畫圖與編輯器的方法實(shí)例
這篇文章主要給大家介紹了關(guān)于如何利用d3.js制作連線動(dòng)畫圖與編輯器的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用d3.js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
移動(dòng)端觸摸滑動(dòng)插件swiper使用方法詳解
這篇文章主要為大家詳細(xì)介紹了移動(dòng)端觸摸滑動(dòng)插件swiper的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-08-08
js實(shí)現(xiàn)頂部可折疊的菜單工具欄效果實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)頂部可折疊的菜單工具欄效果,可實(shí)現(xiàn)鼠標(biāo)滑過(guò)菜單工具欄出現(xiàn)折疊與展開效果,涉及javascript鼠標(biāo)事件及樣式的操作技巧,需要的朋友可以參考下
2015-05-05
JavaScript定義簡(jiǎn)單的頁(yè)面復(fù)選框?qū)崿F(xiàn)全選操作
本文主要介紹了JavaScript定義簡(jiǎn)單的頁(yè)面復(fù)選框?qū)崿F(xiàn)全選操作，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2023-05-05
JavaScript圣杯布局與雙飛翼布局實(shí)現(xiàn)案例詳解
這篇文章主要介紹了JavaScript圣杯布局與雙飛翼布局實(shí)現(xiàn)案例，這是前端面試中需要掌握的知識(shí)點(diǎn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2022-08-08
JS上傳前預(yù)覽圖片實(shí)例
上傳圖片對(duì)圖片進(jìn)行一下預(yù)覽，可以了解圖片上傳后大概會(huì)是什么樣子，此功能用js實(shí)現(xiàn)，然后在fileupload控件的change事件中調(diào)用，這樣當(dāng)用fileupload選擇完圖片以后，圖片就會(huì)自動(dòng)顯示出來(lái)了。功能很簡(jiǎn)單，卻很實(shí)用。
2013-03-03