准确获得页面、窗口高度及宽度的JS

2016-02-19 11:47 60 1 收藏

图老师设计创意栏目是一个分享最好最实用的教程的社区,我们拥有最用心的各种教程,今天就给大家分享准确获得页面、窗口高度及宽度的JS的教程,热爱PS的朋友们快点看过来吧!

【 tulaoshi.com - Web开发 】

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;
}

// for small pages with total width less then width of the viewport
if(xScroll  windowWidth){
pageWidth = windowWidth;
} else {
pageWidth = xScroll;
}


arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
return arrayPageSize;
}
有幸找到了你的这个东东,帮我解决了问题,不过仔细看了下,好象大大的有点问题,参数值和名称上看好象有点对不上号哦. 
// for small pages with total height less then height of the viewport 
if(yScroll  windowHeight){ 
pageHeight = yScroll; 
} else { 
pageHeight = windowHeight; 


// for small pages with total width less then width of the viewport 
if(xScroll  windowWidth){ 
pageWidth = xScroll; 
} else { 
pageWidth = windowWidth; 
}

来源:http://www.tulaoshi.com/n/20160219/1598571.html

延伸阅读
标签: Web开发
JavaScript是基于对象的脚本编程语言,那么它的输入输出就是通过对象来完成的。其中有关输入可通过窗口(Window)对象来完成,而输出可通过文档(document)对象的方法来实现。 四、范例 下列程序演示了你进入主页所停留的时间。 test7_2.htm html form name="myform" td vAlign="top" width="135"您...
标签: windows10
Win10怎么自定义窗口标题栏高度以及滚动条宽度   1、按Win+R打开运行,输入regedit回车打开注册表编辑器; 2、展开 HKEY_CURRENT_USERControl PanelDesktopWindowMetrics; 3、在右侧找到CaptionHeight字符串值,它代表窗口标题栏的高度,其值计算方法为:-15*期望高度(像素)。比如,希望窗口标题栏高度为18,那么其值应该为-...
标签: Web开发
当我们布局一个网页的时候,经常会遇到这样的一种情况,那就是最终网页成型的宽度或是高度会超出我们预先的计算,其实就就是所谓的CSS的盒模型造成的。 如上一段的代码,很多时候我们会把它所占的位置计算成width:120px,height:120px,因为在正常的理解下,padding是内边距,应该是包括在width里面的,而margin是外边距,所以width=margi...
标签: ASP
  <% Class ImgWHInfo '获取图片宽度和高度的类,支持JPG,GIF,PNG,BMP     Dim ASO     Private Sub Class_Initialize         Set ASO=Server.CreateObject("ADODB.Stream")         ASO.Mode=3     &...
标签: Web开发
代码如下: function SetWinHeight(obj)  {  var win=obj;  if (document.getElementById)  {     if (win && !window.opera)     {      if (win.contentDocument && win.contentDocument.body.o...

经验教程

215

收藏

16
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部