页面大小变改变，会触发什么事件吗？解决方法
日期：2014-05-17 浏览次数：20490 次
页面大小变改变，会触发什么事件吗？
要实现一个功能，根据页面显示的大小，控制div的大小，页面结构比较复杂，使用百分比的高度无效，所以要用js动态控制高度，而当页面拉大或拉小时又不能适应了，问，如果页面大小改变时能触发事件的话，就可以在事件中改变div的大小，有这样的事件吗？
------解决方案--------------------
参考：JS获取网页高度及屏幕分辨率高度让DIV层始终在页面最底部
实现的功能：
当页面里内容的高度没有让页面出现滚动条时，页面当前页面的最底部显示。
当出现滚动条后，DIV层会自动向下跟随，在页面的最底部显示。
更改TABLE的高度就可以看到DIV层始终在页面最底部
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS获取网页高度及屏幕分辨率高度让DIV层始终在页面最底部</title>
</head>
<body leftmargin="0" topmargin="0">
<table width="100%" height="405" bgcolor="#eeeeee">
<tr>
<td>
aaa
</td>
</tr>
</table>
<div id="t1" style="position:absolute;border:double;">
aaaaaaa
</div>
<script language="javascript">...
//document.all.t1.style.top = document.body.clientHeight;
var h1 = window.screen.availHeight-165;
if (document.body.clientHeight<h1)
document.all.t1.style.top = window.screen.availHeight-165;
document.write ("当前窗口宽："+document.body.offsetWidth+"； 高："+document.body.clientHeight+"aaaa"+(window.screen.availHeight));
</script>
</body>
</html>
------解决方案--------------------
up
------解决方案--------------------
up
------解决方案--------------------
//页面结构比较复杂，使用百分比的高度无效
使用CSS解决比较合适啊,用JS也可以但通常不这样,毕竟JS的兼容性比CSS要差很多
不清楚是否有这样的事件,不过使用JS的话可以参考定时执行JS函数
关键字:setInterval
------解决方案--------------------
在body的onresize事件中写js控制。
要实现一个功能，根据页面显示的大小，控制div的大小，页面结构比较复杂，使用百分比的高度无效，所以要用js动态控制高度，而当页面拉大或拉小时又不能适应了，问，如果页面大小改变时能触发事件的话，就可以在事件中改变div的大小，有这样的事件吗？
------解决方案--------------------
参考：JS获取网页高度及屏幕分辨率高度让DIV层始终在页面最底部
实现的功能：
当页面里内容的高度没有让页面出现滚动条时，页面当前页面的最底部显示。
当出现滚动条后，DIV层会自动向下跟随，在页面的最底部显示。
更改TABLE的高度就可以看到DIV层始终在页面最底部
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS获取网页高度及屏幕分辨率高度让DIV层始终在页面最底部</title>
</head>
<body leftmargin="0" topmargin="0">
<table width="100%" height="405" bgcolor="#eeeeee">
<tr>
<td>
aaa
</td>
</tr>
</table>
<div id="t1" style="position:absolute;border:double;">
aaaaaaa
</div>
<script language="javascript">...
//document.all.t1.style.top = document.body.clientHeight;
var h1 = window.screen.availHeight-165;
if (document.body.clientHeight<h1)
document.all.t1.style.top = window.screen.availHeight-165;
document.write ("当前窗口宽："+document.body.offsetWidth+"； 高："+document.body.clientHeight+"aaaa"+(window.screen.availHeight));
</script>
</body>
</html>
------解决方案--------------------
up
------解决方案--------------------
up
------解决方案--------------------
//页面结构比较复杂，使用百分比的高度无效
使用CSS解决比较合适啊,用JS也可以但通常不这样,毕竟JS的兼容性比CSS要差很多
不清楚是否有这样的事件,不过使用JS的话可以参考定时执行JS函数
关键字:setInterval
------解决方案--------------------
在body的onresize事件中写js控制。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
