js遮盖层

最新推荐文章于 2021-07-19 15:41:52 发布

翻译最新推荐文章于 2021-07-19 15:41:52 发布 · 953 阅读

文章标签：

#function #login #div #javascript #string #path

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
   String basePath = request.getScheme() + "://"
     + request.getServerName() + ":" + request.getServerPort()
     + path + "/";
%>
<base href="<%=basePath%>">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript" src="<%=basePath%>js/jquery-1.4.3.js"></script>
<STYLE>
#login {
position: relative;
display: none;
top: 20px;
left: 30px;
background-color: #ffffff;
text-align: center;
border: solid 1px;
padding: 10px;
z-index: 1;
}
</STYLE>

//让登陆层显示为块
function showLogin() {
var login = M("login");
login.style.display = "block";
}

//设置DIV层的样式
function change() {
  var login = M("login");
  login.style.position = "absolute";
  login.style.border = "1px solid #CCCCCC";
  login.style.background = "#F6F6F6";
  var i = 0;
  var bodySize = getBodySize();
  login.style.left = (bodySize[0] - i * i * 4) / 2 + "px";
  login.style.top = (bodySize[1] / 2 - 100 - i * i) + "px";
  login.style.width = i * i * 4 + "px";
  login.style.height = i * i * 1.5 + "px";

  popChange(i);
}
//让DIV层大小循环增大
function popChange(i) {
  var login = M("login");
  var bodySize = getBodySize();
  login.style.left = (bodySize[0] - i * i * 4) / 2 + "px";
  login.style.top = (bodySize[1] / 2 - 100 - i * i) + "px";
  login.style.width = i * i * 4 + "px";
  login.style.height = i * i * 1.5 + "px";
  if (i <= 10) {
   i++;
   setTimeout("popChange(" + i + ")", 10);//设置超时10毫秒
  }
}
//打开DIV层
function open() {
  change();
  showLogin();
  popCoverDiv();
  void (0);      //不进行任何操作,如：__tag_122$20_aaa__tag_122$35_
}
//关闭DIV层
function close() {
  M('login').style.display = 'none';
  M("cover_div").style.display = 'none';
  void(0);
}
</script>
</head>

<body>

</html>