首页 > 代码库 > struts2中用iframe遮罩frameset
struts2中用iframe遮罩frameset
项目中遇到的遮罩问题
///////////////////////////////////index.jsp/////////////////////////////////////////
<html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<head>
<style type="text/css">
#greyLayer{position:absolute;top:0;left:0;background-color:#fff;display:true;opacity:.5;filter:alpha(opacity=50)}
#privacyLayer{width:800px;height:500px;border:1px solid #656451;position:absolute;top:200px;left:300px;background-color:#fff;display:none;z-index:10000; text-align:center;}
#privacyLayer .title{line-height:30px;font-weight:bold;padding:0;margin:0;font-size:16px;text-align:center;background-color:#FFFFCF;border-bottom:1px solid #656451}
#privacyLayer .con{}
#privacyLayer .btn{line-height:20px;text-align:center;margin-top:20px;}
#privacyLayer .r{line-height:40px;color:#000;font-weight:bold;font-size:14px;}
#privacyLayer .c{line-height:40px;color:#000;font-size:13px;}
.mask { position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;
z-index: 1002; left: 0px;
opacity:0.5; -moz-opacity:0.5; }
</style>
<title></title>
<script src="http://www.mamicode.com/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
//兼容火狐、IE8
function showMask(){
$("#mask").css("height",$(document).height());
$("#mask").css("width",$(document).width());
$("#mask").show();
}
function openPrivacyLayer(){
/* var greyLayer = document.getElementById(‘greyLayer‘);
with(greyLayer.style){
display = ‘block‘;
height = document.body.scrollHeight+‘px‘;
width = document.body.scrollWidth+‘px‘;
}
*/
showMask();
var top1;
var left1;
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
{
diffY = document.documentElement.scrollTop;
left1 = document.documentElement.scrollLeft;
//alert(diffY);
}
else if (document.body){
diffY = document.body.scrollTop;
left1 = document.body.scrollLeft;
//alert(diffY);
}
else
{/*Netscape stuff*/}
var privacyLayer = document.getElementById(‘privacyLayer‘);
var xWidth = privacyLayer.currentStyle.width;
var xHeight = privacyLayer.currentStyle.height;
if (xWidth == ‘null‘ || xWidth == ‘‘)
{
xWidth = window.getComputedStyle(privacyLayer,null).style.width;
xHeight = window.getComputedStyle(privacyLayer,null).style.width;
}
xWidth = parseInt(xWidth.replace("px",""),10);
xHeight = parseInt(xHeight.replace("px",""),10);
//alert(xHeight);
with(privacyLayer.style){
display = ‘block‘;
left = left1+((window.innerWidth || document.documentElement && document.documentElement.clientWidth || document.body.offsetWidth)-xWidth)/2+‘px‘;
top = diffY + ((window.innerHeight || document.documentElement && document.documentElement.clientHeight || document.body.offsetHeight)-xHeight)/2+‘px‘;
}
}
var ii = 20;
function showDisabled(){
ii = parseInt(ii) - 1;
if(ii<1){
document.getElementById(‘close‘).innerHTML = ‘<a href="javascript:closePrivacy()" id="closePrivacy" >阅读完毕</a>‘;
}else{
document.getElementById(‘close‘).innerHTML = ii+‘秒后阅读完毕‘;
setTimeout(‘showDisabled()‘,1000);
}
}
setTimeout(‘showDisabled()‘,1000);
function closePrivacy(){
document.forms[0].action="getInstancyAnnouncementByUser.action";
document.forms[0].submit();
}
function sendReceipt2(){
document.forms[0].action="sendReceipt2.action";
document.forms[0].submit();
}
</script>
</head>
<body onl oad="openPrivacyLayer();">
<form>
<div id="mask" class="mask"></div>
<iframe id="greyLayer" width="100%" height="100%" src="http://www.mamicode.com/main.jsp"></iframe>
<s:iterator id="announcement" value="http://www.mamicode.com/instancyAnnouncements" status="i">
<input type="hidden" id="id" name="announcement.id" value="http://www.mamicode.com/
<h1 class="title"> 紧 急 公 告</h1>
<div class="r">标题：<s:property value="http://www.mamicode.com/announcement.title"/></div>
<div class="c">
<table>
<tr height="30">
<th width="150">公告类别： </th>
<td>
<s:property value="http://www.mamicode.com/announcement.announcementCategoryName"/>
</td>
<th width="150">公告子类别：
</th>
<td><s:property value="http://www.mamicode.com/announcement.subAnnouncementCategoryName"/>
</td>
</tr>
<tr>
<th width="150">
优先级:
</th>
<td>
<s:property value="http://www.mamicode.com/announcement.priorityName"/>
</td>
<th>有效时间：</th>
<td><s:property value="http://www.mamicode.com/announcement.startEffectiveDate"/> 到 <s:property value="http://www.mamicode.com/announcement.endEffectiveDate"/></td>
</tr>
<tr height="30">
<th width="150">
发送人：
</th>
<td>
<s:property value="http://www.mamicode.com/announcement.sendPersonName"/>
</td>
<th width="150">
发送时间：
</th>
<td>
<s:property value="http://www.mamicode.com/announcement.sendDate"/>
</td>
</tr>
</table>
</div>
<div id="privacyContent" class="con">
<div><textarea cols="80" rows="25" wrap="virtual" style="width:90%;font-size:14.9px;height:320px;" readonly="readonly">公告内容：<s:property value="http://www.mamicode.com/announcement.content"/></textarea></div>
<div><table>
<s:iterator id="announcementUploadFile" value="http://www.mamicode.com/announcementUploadFileList" status="i">
<tr>
<th>附件：</th>
<td>
<a href="http://www.mamicode.com/downAnnouncementUploadFile.action?announcementUploadFile.id=
</tr>
</s:iterator>
</table></div>
</div>
<div class="btn"><div id="close" >20秒后阅读完毕</div></div>
</div>
</s:iterator>
</form>
</body>
</html>
////////////////////////main.jsp/////////////////////////////
<html>
<head>
<title></title>
<link id="index_link_easyuiThemes" rel="stylesheet" href="http://www.mamicode.com/js/jquery-easyui-1.2.5/themes/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="http://www.mamicode.com//js/jquery-easyui-1.2.5/themes/icon.css"/>
<link href="http://www.mamicode.com/CSS/pages.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://www.mamicode.com/js/common.js" ></script>
<script language="javascript" type="text/javascript" src="http://www.mamicode.com/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" charset="UTF-8" src="http://www.mamicode.com//js/jquery-easyui-1.2.5/jquery-1.7.1.min.js"/></script>
<script type="text/javascript" src="http://www.mamicode.com/js/jquery-easyui-1.2.5/jquery.easyui.min.js"/>
<script type="text/javascript" src="http://www.mamicode.com/js/jquery-easyui-1.2.5/locale/easyui-lang-zh_CN.js"/>
<script type="text/javascript" charset="UTF-8" src="http://www.mamicode.com/js/jquery-easyui-1.2.5/easyuiUtil.js"/>
<script type="text/javascript"> jQuery.noConflict();</script>
</head>
<frameset rows="108,*" frameborder="no" border="0" framespacing="0" name="allFrame">
<frame src="http://www.mamicode.com/getLoginUserShow.action" name="topFrame" scrolling="no" noresize>
<frameset rows="*,30" frameborder="no" border="0" framespacing="0" name="bodyFrame">
<frameset cols="230,*" frameborder="no" border="0" framespacing="0" name="menuFrame">
<frame src="http://www.mamicode.com/getUserMenuList.action" name="menu" id="menu" scrolling="auto" noresize>
<frameset cols="6,*" frameborder="no" border="0" framespacing="0" name="mainFrame">
<frame src="http://www.mamicode.com/switch.jsp" name="switch" id="switch1" scrolling="no" noresize>
<frame id="right" src="http://www.mamicode.com/right.jsp" name="right" scrolling="auto" noresize>
</frameset>
</frameset>
<frame src="http://www.mamicode.com/foot.jsp" name="footFrame" scrolling="no" noresize>
</frameset>
</frameset>
</html>