火狐中显示DIV滚动条
火狐中显示DIV滚动条
代码:
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> </title>
<script type="text/javascript">
window.onload=function (){
var t=document.getElementById("t");
var one=document.getElementById("one");
one.style.height=window.document.body.clientHeight-25;
}
function change()
{
var t=document.getElementById("t");
var one=document.getElementById("one");
one.style.height=window.document.body.clientHeight-25;
}
</script>
</head>
<body onresize="change();">
<table width="173" height="100%" border="0" cellpadding="0"
cellspacing="0" id="t" >
<tr>
<td height="3%" background="main/util/img/main_11.gif">
</td>
</tr>
<tr>
<td>
<div id="one" style="overflow-y:scroll;overflow-x:scroll;margin: 0, 0, 0, 0; height:auto;height*:100%;width: 173px;" >
<jsp:include page="tree.jsp"></jsp:include>
</div>
</td>
</tr>
</table>
</body>
</html>
如果Div的height用%比表示时,并且该div中的内容超过页面高度,在火狐浏览器中将不显示滚动条。如果要显示滚动条要用px表示height;
height:auto;height*:100%;表示在所有浏览器中height适应,在ie中为100%,火狐不认识*。
window.onload=function (){
var t=document.getElementById("t");
var one=document.getElementById("one");
one.style.height=window.document.body.clientHeight-25;
}
此段代码表示将height:auto的高度设成body的高度减去25px;
这样在火狐和ie中就可以显示滚动条的效果了。
但是按下F11发现ie全屏了,而火狐中的table没有达到效果。
解决办法:
function change()
{
var t=document.getElementById("t");
var one=document.getElementById("one");
one.style.height=window.document.body.clientHeight-25;
}
在BODY中加一个onresize事件,如果body大小改变了,引发事件,重新定义div中的height,达到效果。
1 楼 qianbaidu 2012-01-30 受教了,正好解决了我的jsp页面问题。