您的位置：首页 > Web前端 > JavaScript

javascript 页面高度宽度等

2008-04-22 23:11 232 查看

网页可见区域宽： document.body.clientWidth;
网页可见区域高： document.body.clientHeight;
网页可见区域宽： document.body.offsetWidth; 包括边线的宽;
网页可见区域高： document.body.offsetHeight;包括边线的宽;
网页正文全文宽： document.body.scrollWidth;
网页正文全文高： document.body.scrollHeight;
网页被卷去的高： document.body.scrollTop;
网页被卷去的左： document.body.scrollLeft;
网页正文部分上： window.screenTop;
网页正文部分左： window.screenLeft;
屏幕分辨率的高： window.screen.height;
屏幕分辨率的宽： window.screen.width;
屏幕可用工作区高度： window.screen.availHeight;
屏幕可用工作区宽度：window.screen.availWidth;
当前鼠标位置的X坐标：document.body.scrollLeft+event.clientX; 网页横向滚动条的左位置 + 事件源的X坐标
当前鼠标位置的Y坐标：document.body.scrollTop+event.clientY;

附以前收集的代码作者枫岩

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title> 代码实例：获取页面滚动高度 scrollTop（For: IE5.0+、Firefox1.06+ ...） </title>

var w3c=(document.getElementById)? true: false;

var agt=navigator.userAgent.toLowerCase();

var ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1) && (agt.indexOf("omniweb") == -1));

function IeTrueBody()...{

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;

}

function GetScrollTop()...{

return ie ? IeTrueBody().scrollTop : window.pageYOffset;

}

function getPageScroll()...{

var yScroll;

if (self.pageYOffset) ...{

yScroll = self.pageYOffset;

} else if (document.documentElement && document.documentElement.scrollTop)...{ // Explorer 6 Strict

yScroll = document.documentElement.scrollTop;

} else if (document.body) ...{// all other Explorers

yScroll = document.body.scrollTop;

}

arrayPageScroll = new Array('',yScroll)

return arrayPageScroll;

}

function getPageSize()...{

var xScroll, yScroll;

if (window.innerHeight && window.scrollMaxY) ...{

xScroll = document.body.scrollWidth;

yScroll = window.innerHeight + window.scrollMaxY;

} else if (document.body.scrollHeight > document.body.offsetHeight)...{ // all but Explorer Mac

xScroll = document.body.scrollWidth;

yScroll = document.body.scrollHeight;

} else ...{ // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari

xScroll = document.body.offsetWidth;

yScroll = document.body.offsetHeight;

}

var windowWidth, windowHeight;

if (self.innerHeight) ...{ // all except Explorer

windowWidth = self.innerWidth;

windowHeight = self.innerHeight;

} else if (document.documentElement && document.documentElement.clientHeight) ...{ // Explorer 6 Strict Mode

windowWidth = document.documentElement.clientWidth;

windowHeight = document.documentElement.clientHeight;

} else if (document.body) ...{ // other Explorers

windowWidth = document.body.clientWidth;

windowHeight = document.body.clientHeight;

}

// for small pages with total height less then height of the viewport

if(yScroll < windowHeight)...{

pageHeight = windowHeight;

} else ...{

pageHeight = yScroll;

}

if(xScroll < windowWidth)...{

pageWidth = windowWidth;

} else ...{

pageWidth = xScroll;

}

arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight,xScroll,yScroll)

return arrayPageSize;

//return pageHeight;

}

</script>

</head>

<body>

<a href="javascript:alert(GetScrollTop());">GetScrollTop()滚动条高度1</a>

<a href="javascript:alert(getPageScroll()[1]);">getPageScroll()[1]滚动条高度2</a>

<a href="javascript:alert(getPageSize()[0].toString()+'/'+getPageSize()[1].toString()+'/'+getPageSize()[2].toString()+'/'+getPageSize()[3].toString()+'/'+getPageSize()[4].toString()+'/'+getPageSize()[5].toString());">getPageSize()页面宽度,高度,窗口宽度,高度</a>

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航