jsp页面
在jsp页面中div层不随着窗口的大小变化而变化,怎么设置?(当页面不是全屏的时候div里面的数据就会超出来)
function showDiv(can){
var yes = document.getElementById("divyes");
var no = document.getElementById("divno");
if(can == "1"){
yes.style.display = 'block';
no.style.display = 'none';
}else{
yes.style.display = 'none';
no.style.display = 'block';
}
}
<div id="divyes" style="display:none">
<table width="754" border="1" borderColorDark="#ffffff" borderColorLight="#c0c0c0" cellpadding="0" cellspacing="0">
<tr style="font-size: 14px;">
<td height="13px" align="center" class="header">单据号</td>
<td align="center" class="header">询价日期</td>
<td align="center" class="header">物料编号</td>
<td align="center" class="header">物料名称</td>
<td align="center" class="header">规格型号</td>
<td align="center" class="header">单位</td>
<td align="center" class="header">数量</td>
<td align="center" class="header">单价</td>
</tr>
<%
if(paritylists2 != null){
for(int i = 0; i < paritylists2.size(); i++){
WzMatparitylist pl = (WzMatparitylist)paritylists2.get(i);
%>
<tr style="font-size: 14px;">
<td height="13px" align="center"><%=pl.getId() == null?"":pl.getId()%></td>
<td align="center"><%=pl.getSendsdate() == null?"":pl.getSendsdate()%></td>
<td align="center"><%=pl.getMatcode() == null?"":pl.getMatcode()%></td>
<td align="center"><%=pl.getMatname() == null?"":pl.getMatname()%></td>
<td align="center"><%=pl.getMattype() == null?"":pl.getMattype()%></td>
<td align="center"><%=pl.getMatunit() == null?"":pl.getMatunit()%></td>
<td align="center"><%=pl.getOrdercount() == null?"":pl.getOrdercount()%></td>
<td align="center"><%=pl.getInprice() == null?0:pl.getInprice()%></td>
</tr>
<%}}%>
</table>
</div>
[解决办法]
在window.onresize事件处理中动态调整div的大小,比如:
<script>
function getViewportInfo() {
var w = (window.innerWidth) ? window.innerWidth : (document.documentElement && document.documentElement.clientWidth) ? document.documentElement.clientWidth : document.body.offsetWidth; var h = (window.innerHeight) ? window.innerHeight : (document.documentElement && document.documentElement.clientHeight) ? document.documentElement.clientHeight : document.body.offsetHeight;
return {w:w,h:h};
}
window.onresize=function (){
//比如设置div的长宽都是页面的1/2
document.getElementById("divyes").style.width=getViewportInfo().w/2;
document.getElementById("divyes").style.height=getViewportInfo().h/2;
};