javascript获得网页窗口实际大小的示例代码

javascript代码：


代码如下:

function get_page_size()
{
var re = {};
if (document.documentElement && document.documentElement.clientHeight)
{
var doc = document.documentElement;
re.width = (doc.clientWidth>doc.scrollWidth)?doc.clientWidth-1:doc.scrollWidth;
re.height = (doc.clientHeight>doc.scrollHeight)?doc.clientHeight:doc.scrollHeight;
}
else
{
var doc = document.body;
re.width = (window.innerWidth>doc.scrollWidth)?window.innerWidth:doc.scrollWidth;
re.height = (window.innerHeight>doc.scrollHeight)?window.innerHeight:doc.scrollHeight;
}
return re;
}
904 viewed 3 comment(s)

代码实例：


代码如下:

<!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=utf-8" />
<title>获取窗口大小</title>
<script type="text/java script">
function getPageSize()
{
var re = {};
if (document.documentElement && document.documentElement.clientHeight)
{
var doc = document.documentElement;
re.width = (doc.clientWidth>doc.scrollWidth)?doc.clientWidth-1:doc.scrollWidth;
re.height = (doc.clientHeight>doc.scrollHeight)?doc.clientHeight:doc.scrollHeight;
}
else
{
var doc = document.body;
re.width = (window.innerWidth>doc.scrollWidth)?window.innerWidth:doc.scrollWidth;
re.height = (window.innerHeight>doc.scrollHeight)?window.innerHeight:doc.scrollHeight;
}
//结果输出至两个文本框
document.form1.availHeight.value= re.width;
document.form1.availWidth.value= re.height;
return re;
}
</script>
</head>
<body>
<form action="#" method="get" name="form1" id="form1">
浏览器窗口 的 实际高度:
<input type="text" name="availHeight" size="4"/>
<br />
浏览器窗口 的 实际宽度:
<input type="text" name="availWidth" size="4"/>
<br />
</form>
<script type="text/java script">
getPageSize();
window.onresize=getPageSize;
</script>
</body>
</html>

赞 (0)

相关推荐

  • javascript获得网页窗口实际大小的示例代码

    javascript代码: 复制代码 代码如下: function get_page_size() { var re = {}; if (document.documentElement && document.documentElement.clientHeight) { var doc = document.documentElement; re.width = (doc.clientWidth>doc.scrollWidth)?doc.clientWidth-1:doc.scr

  • Javascript实现获取窗口的大小和位置代码分享

    Javascript实现获取窗口的大小和位置代码分享

    在Javascript中可以使用OuterWidth,OuterHeight 获取浏览器的大小.用 innerWidth,innerHeight 来获取窗口的大小(除去浏览器边框部分).对于IE6 及之前版本,要区分是标准模式,还是混杂模式.标准模式使用document.documentElement.clientWidth,document.documentElement.clientHeight:混杂模式使用document.body 的clientWidth,clientHeight. 复

  • 鼠标滚轮改变图片大小的示例代码

    鼠标滚轮改变图片大小的示例代码<script> function onWheelZoom(obj){         zoom = parseFloat(obj.style.zoom);         tZoom = zoom + (event.wheelDelta>0 ? 0.05 : -0.05);         if( tZoom > 1 || tZoom<0.1 ) return true;         obj.style.zoom=tZoom;       

  • 基于JavaScript实现 网页切出 网站title变化代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="UTF-"> <title>这里是网站标题</title> </head> <body> <script type="text/javascript"> document.body.onfocus = function

  • JavaScript使用Ajax上传文件的示例代码

    本文介绍了JavaScript使用Ajax上传文件的示例代码,分享给大家,具体如下: 实现文件的上传主要有两种方式: 使用form表单提交上传 html代码如下: <form id="uploadForm" enctype="multipart/form-data"> <input id="file" type="file" name="file"/> <button id=&

  • javascript实现Emrips反质数枚举的示例代码

    javascript实现Emrips反质数枚举的示例代码

    今天看到一个kata,提出一个"emirps"的概念:一个质数倒转后得到的是一个不同的质数,这个数叫做"emirps". 例如:13,17是质数,31,71也是质数,13和17是"emirps". 但是质数757,787,797是回文质数,这意味着反转的数字与原始数字相同,所以它们不被认为是"emirps". 题目要求写一个函数输入一个正整数n,返回小于n的"emirps"的个数,其中最大"emi

  • 微信公众号网页分享功能开发的示例代码

    现在每天都可以看到很多微信分享的链接上面有网站或者商家的自定义的分享标题,和分享链接的描述及分享出去的图像,例如下面的分享出去的链接: 上面这个是微信的js-SDK页面分享给微信好友在聊天列表中显示的视觉效果. 微信JS-SDK Demo :这个是微信网页分享出去的标题. 微信JS-SDK,帮助第三方为用户提供更优质的移动web服务:这个是被分享的这个页面的分享描述. 微信图标:这个就是自己网站或者自己自定义的图像. 上面这个是微信官方网页分享出去的定义描述,那么怎样实现自己网站网页的自定义分享

  • Python 通过爬虫实现GitHub网页的模拟登录的示例代码

    1. 实例描述 通过爬虫获取网页的信息时,有时需要登录网页后才可以获取网页中的可用数据,例如获取 GitHub 网页中的注册号码时,就需要先登录账号才能在登录后的页面中看到该信息,如下图所示.那么该如何实现模拟登录的功能呢?本文实现将通过爬虫实现 GitHub 网页的模拟登录. 2. 代码实现 在实现 GitHub 网页的模拟登录时,首先需要查看提交登录请求时都要哪些请求参数,然后获取登录请求的所有参数,再发送登录请求.如果登录成功的情况下获取页面中的注册号码信息即可.具体步骤如下: (1) 点

  • JavaScript/TypeScript 实现并发请求控制的示例代码

    场景 假设有 10 个请求,但是最大的并发数目是 5 个,并且要求拿到请求结果,这样就是一个简单的并发请求控制 模拟 利用 setTimeout 实行简单模仿一个请求 let startTime = Date.now(); const timeout = (timeout: number, ret: number) => { return (idx?: any) => new Promise((resolve) => { setTimeout(() => { const compa

  • C# Winform 实现控件自适应父容器大小的示例代码

    在日常开发中经常遇到控件不能随着父容器大小的改变而且自动改变控件的所在位置和大小.以下是实现的代码 /// <summary> /// 根据父容器实现控件自适应大小位置 /// </summary> /// <param name="control">所需自适应大小位置的控件</param> private void ChangeLocationSizeByParent (Control control) { //记录父容器大小,来判断改

随机推荐