提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  后端

当前栏目

js弹出窗口之弹出层的小例子

JS 窗口 例子 弹出 出层
2023-06-13 09:15:01 时间
[html]
复制代码代码如下:

<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> 
<HTMLxmlns="http://www.w3.org/1999/xhtml"> 
<HEAD> 
<TITLE>弹出窗口</TITLE> 
<METAhttp-equiv=Content-Typecontent="text/html;charset=utf-8"> 
<style> 
#popupcontent{  
 position:absolute; 
 visibility:hidden;    
 overflow:hidden;    
 border:1pxsolid#CCC;    
 background-color:#F9F9F9;    
 border:1pxsolid#333;    
 padding:5px;} 
</style> 
<script> 
varbaseText=null;  
functionshowPopup(w,h){    
   varpopUp=document.getElementById("popupcontent");    
   popUp.style.top="200px";    
   popUp.style.left="200px";    
   popUp.style.width=w+"px";    
   popUp.style.height=h+"px";     
   if(baseText==null)baseText=popUp.innerHTML;   
   popUp.innerHTML=baseText+"<divid=\"statusbar\"><inputtype=\"button\"value=\"Closewindow\"onClick=\"hidePopup();\"></div>";    
   varsbar=document.getElementById("statusbar");    
   sbar.style.marginTop=(parseInt(h)-60)+"px";   
   popUp.style.visibility="visible"; 
} 
functionhidePopup(){    
   varpopUp=document.getElementById("popupcontent");    
   popUp.style.visibility="hidden"; 
} 
</script> 
<METAcontent="MSHTML6.00.2900.2838"name=GENERATOR></HEAD> 
<BODY> 
<divid="popupcontent">content</div> 

 
<p><ahref="#"onClick="showPopup(300,200);">onclick</a></p> 
</BODY> 
</HTML> 

相关文章