文章摘要
这篇文章描述了一个JavaScript函数findDimensions，用于动态获取网页窗口的宽度和高度，并根据这些尺寸调整CSS样式。函数通过多种方法获取窗口大小，包括使用window对象、document.body和元素的属性。它还根据获取的尺寸自动调整布局，例如将宽度设为1100px或100%，高度设为600px或100%。这些逻辑通过在窗口重绘时调用函数实现。
var winWidth=0;
var winHeight=0;
function findDimensions()
{
//获取窗口宽度
if (window.innerWidth)
{
winWidth=window.innerWidth;
}
else if ((document.body) && (document.body.clientWidth))
{
winWidth=document.body.clientWidth; //获取窗口高度
}
if (window.innerHeight)
{
winHeight=window.innerHeight;
}
else if ((document.body) && (document.body.clientHeight))
{
winHeight=document.body.clientHeight;
}
//通过深入Document内部对body进行检测，获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth)
{
winHeight=document.documentElement.clientHeight;
winWidth=document.documentElement.clientWidth;
}
var cssSize=document.styleSheets[0].rules||document.styleSheets[0].cssRules;
if(winWidth < 1100)
{
cssSize[0].style.width=”1100px”;
}
else
{
cssSize[0].style.width=”100%”;
}
if(winHeight < 600)
{
cssSize[0].style.height=”600px”;
}
else
{
cssSize[0].style.height=”100%”;
}
}
window.onresize=findDimensions;
function pageInit() {
//调用函数，获取数值
findDimensions();
}
© 版权声明
文章版权归作者所有，未经允许请勿转载。
