點擊彈出窗口層背景變暗

2011-05-19 窗口頁面 ℃

<!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" lang="zh-CN">

<head>

<meta http-equiv="Content-Language" content="zh-cn" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="robots" content="all" />
<meta name="Copyright" content="Copyright (c) jscode.cn" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" media="screen" />
<meta name="description" content="国产欧美17694免费观看视频,久久精品国产99国产精品免费看,欧美日韩中文字幕,免费观看在线观看日韩AV,久久三级香港视频,亚洲日韩久久禁精品" />
<meta name="keywords" content="国产欧美17694免费观看视频,久久精品国产99国产精品免费看,欧美日韩中文字幕" />

<title>點擊彈出窗口層，并且背景變暗漸變---資料庫 well-network.com</title>
<style>
body {font-size:12px;background:#9EC7E7}
img {border:0px}
#msgDiv {
    z-index:10001;
    width:500px;
    height:400px;
    background:white;
    border:#336699 1px solid;
    position:absolute;
    left:50%;
    top:20%;
    font-size:12px;
    margin-left:-225px;
    display: none;
}
#bgDiv {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    right:0px;
    background-color: #777;
    filter:progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75)
    opacity: 0.6;
}
</style>
<script type="text/javascript"> 
function showDetail() { //
//背景
  var bgObj=document.getElementById("bgDiv");
  bgObj.style.width = document.body.offsetWidth + "px";
  bgObj.style.height = screen.height + "px";

//定義窗口
  var msgObj=document.getElementById("msgDiv");
  msgObj.style.marginTop = -75 +  document.documentElement.scrollTop + "px";

//關閉
  document.getElementById("msgShut").onclick = function(){
  bgObj.style.display = msgObj.style.display = "none";
  }
  msgObj.style.display = bgObj.style.display = "block";
  msgDetail.innerHTML="<p align=center>小窗口里的內容</p><p align=center>顯示的內容</A></p>"
}
</script>
</head>

<body>

<div   class="vg0dgwb"   id="msgDiv">
	<div   class="e3obo0n"   id="msgShut">
		關閉</div>
	<div   class="b4ama9n"   id="msgDetail">
	</div>
</div>
<div   class="awx0rhy"   id="bgDiv">
</div>
<p>　</p>
<p><a href="#" onClick="showDetail()">點擊我試試看</a></p>
<p>　</p>
<p>　</p>
<p>　</p>
<p>　</p>

</body>

</html>

相關特效代碼: 點擊按鈕淡入淡出彈出圖文信息03/31; 狀態(tài)欄文字從右彈出08/22; jQuery 彈出菜單層05/19; Js仿開心網好友印象功能（點擊文字彈出印象框）12/31; 文字從右彈出的狀態(tài)欄特效12/23; 文字從左依次彈出的狀態(tài)攔12/23; 狀態(tài)欄文字快速依次彈出12/23; 狀態(tài)欄中文字組合彈出12/23; 設置多少時間后才彈出窗口12/22; 彈出一個淡入淡出的提示框11/26

熱門特效代碼: 彈出式窗口代碼生成器; 自動刷新網頁代碼; 在狀態(tài)欄中顯示停留時間; 根據不同的分辨率自動采用預設的; 點擊彈出窗口層背景變暗; 每個IP每天只彈一次的窗口; 打開瀏覽器窗口最大化效果; N秒后不詢問自動關閉窗口; 自由控制打開的窗口; 框架加載時的loading效果，兼容F

推薦特效代碼: 每個IP每天只彈一次的窗口; 打開瀏覽器窗口最大化效果; N秒后不詢問自動關閉窗口; 點擊打印網頁代碼; 變色的表格框; 漂亮的CSS園角效果