不需要 jq 的关机效果
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Pages_Module_Default" %>
<!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 runat="server">
<title></title>
<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
//不需要jq
function modalDiv() {
this.hiddenDiv = null;
this.init();
}
modalDiv.prototype = {
init: function() {
if (typeof (this.hiddenDiv) == undefined || this.hiddenDiv == null) {
this.hiddenDiv = document.createElement("div");
this.hiddenDiv.id = "aqiooJshHiddenDiv";
var OsObject = "";
if (navigator.userAgent.indexOf("MSIE") > 0) {
this.hiddenDiv.style.cssText='filter: alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;width: 100%; height: 100%; text-align: center; background-color: #000; z-index: 1000;position: absolute; overflow: hidden;display:none';
}
else {
this.hiddenDiv.setAttribute('style', 'filter: alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;width: 100%; height: 100%; text-align: center; background-color: #000; z-index: 1000;position: absolute; overflow: hidden;display:none');
}
document.body.appendChild(this.hiddenDiv);
}
},
getPos: function(ele) {
var width = ele.offsetWidth;
var height = ele.offsetHeight;
var left = ele.offsetLeft;
var top = ele.offsetTop;
while (ele = ele.offsetParent) {
left += ele.offsetLeft;
top += ele.offsetTop;
}
return [left, top, height, width];
},
showHidden: function(contentId) {
var ele = document.getElementById(contentId);
if (ele) {
var pos = this.getPos(ele);
this.hiddenDiv.style["left"] = pos[0] + 'px';
this.hiddenDiv.style["top"] = pos[1] + 'px';
this.hiddenDiv.style["height"] = pos[2] + 'px';
this.hiddenDiv.style["width"] = pos[3] + 'px';
this.hiddenDiv.style["display"] = "";
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="mydiv" style="width: 800px; height: 600px; border: solid 1px red; margin: 100px auto;">
ddddddddd
</div>
<input id="Button1" type="button" value="移动" onclick="showHiden();" />
<script type="text/javascript">
function showHiden() {
if (typeof (myhiddendiv) != undefined) {
myhiddendiv = new modalDiv();
myhiddendiv.showHidden("mydiv");
}
}
</script>
</form>
</body>
</html>
posted on 2010-06-20 01:32 jianshaohui 阅读(159) 评论(0) 编辑 收藏 举报