<!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>
<title>请调整浏览器窗口</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
</head>
<body>
<h2 align="center">请调整浏览器窗口大小</h2><hr>
<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/javascript">
<!--
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;
}
//结果输出至两个文本框
document.form1.availHeight.value= winHeight;
document.form1.availWidth.value= winWidth;
}
findDimensions();
//调用函数，获取数值
window.onresize=findDimensions;
//-->
</script>
</body>
</html>
分享到：
相关推荐
实现思路： 1、在页面加载完成之后，使用js给每个pre标签增加一个按钮“复制代码” 2、给按钮增加点击事件，点击事件的功能就是复制代码块的内容 实现代码： css部分，btn-pre-copy是pre标签中使用js增加的...
3. 防止点击空链接时页面往往重置到页首端：使用 "javascript :void(null)" 代替原来的 "#" 标记，以 防止页面重置。 知识点：JavaScript、HTML 4. 如何避免别人把你的网页放在框架中：使用 JavaScript 语句来检测...
JS如何实现页面截屏功能实例代码 "页面截屏"是前端经常遇到的需求，比如页面生成海报，弹窗图片分享等，因为浏览器没有原生的截图API，所以需要借助canvas来实现导出图片实现需求。 方案1：需要手动计算每个DOM...
外部式（外链式）：将JavaScript代码写在一个单独的文件中，一般使用“js”作为文件的扩展名，在HTML页面中使用标签进行引入，适合JavaScript代码量比较多的情况。注意外部式的标签内不可以编写JavaScript代码 ...
1．本书1~21章所附代码的运行环境 操作系统：Windows 2003、Windows XP Professional，或者Windows 2000 开发环境：UltraEdit12.10a、eclipse-jee-europa Web浏览器：Microsoft Internet Explorer 6.0及以上版本 ...
1.21 用JavaScript随机修改页面的标题 1.22 判断网页加载完毕 1.23 嵌入网页的播放器 1.24 设置指定网页为主页 1.25 使用JavaScript传递页面参数 1.26 页面被冻结 第 2章 按钮特效 2.1 页面刷新按钮 2.2 按回车调用...
JavaScript电子书，包括了JavaScript的大部分知识，可以帮助读者快速入门。内容如下： 第1章 JavaScript语言概述 1.1 JavaScript是什么 1.1.1 JavaScript简史 1.1.2 JavaScript有何特点 1.2 JavaScript能做什么 ...
1.21 用JavaScript随机修改页面的标题 1.22 判断网页加载完毕 1.23 嵌入网页的播放器 1.24 设置指定网页为主页 1.25 使用JavaScript传递页面参数 1.26 页面被冻结 第 2章 按钮特效 2.1 页面刷新按钮 2.2 按回车调用...
封装一个js文件 // 打印类属性、方法定义 /* eslint-disable */ const Print = function (dom, options) { if (!(this instanceof Print)) return new Print(dom, options); this.options = this.extend({ '...
JS中的常用对象[转载]web 技术 2010-06-05 15:00:30 阅读3 评论0 字号：大中小 订阅 [removed] Window For JavaScript 熟练window对象的open、close、alert、confirm、prompt、setTimeout、clearTimeout、...
你可以仅仅通过data属性API就能使用所有Bootstrap中的插件，而且不用写一行JavaScript代码。这是Bootstrap中的一等API，并且是你的首选方式。 特殊情况是，在某些情况下可能需要特意禁用这种默认动作。...
该框架提供丰富的对象模型、声明性双向数据绑定、计算属性，Handlebars.js提供的自动更新模板，以及一个路由器管理应用程序状态。 -Meteor.js是一个专门为单页应用设计的全栈（客户端-服务器）JavaScript框架。它...
ac-code 属性抽取代码及数据 entities-base 实体库 filters 过滤器 filters-data 过滤器所使用的相关资源 ner-data 命名实体识别数据 ner-code 命名实体识别最新代码 rc-code 关系抽取代码及数据 .gitignore git忽略...
全屏轮播代码是指在Web页面中实现全屏轮播效果的代码，该代码通常使用HTML、CSS、JavaScript等技术来实现。下面是对该代码的详细解释： 1. HTML结构 从代码中可以看到，整个全屏轮播组件被包围在一个div容器中，该...
你可以仅仅通过data属性API就能使用所有Bootstrap中的插件，而且不用写一行JavaScript代码。这是Bootstrap中的一等API，并且是你的首选方式。 特殊情况是，在某些情况下可能需要特意禁用这种默认动作。因此，我们...
ePage是通用页面设计工具领域的一次重大革新，比传统设计平台开发效率提高10倍以上，同时页面质量和稳定性维护性也得到了极大提高。 本下载包为绿色免费版，展开即可运行，内含： 1. ePage集成开发环境 2. eEngine...
这使您可以用代码声明性地构造内容。 安装与使用 Simpla-paths在NPM / Yarn，Bower和Unpkg CDN上可用 $ npm i simpla-paths --save $ bower i simpla-paths --save https://unpkg.com/simpla-paths@^1.0.0 在页面...
在JavaScript中，遍历一个对象的属性往往没有在其他语言中遍历一个哈希(有些语言称为字典)的键那么简单。...注：示例代码中，我们要遍历的对象是浏览器中的window，环境为Firefox 19，代码运行在空白页面中的scr
在做B/S开发的时候，通常会遇到很多的客户与服务器的交流，而浏览器自带的弹出工具条是不能修改样式的，用JS模拟一个华丽的工具条逐渐成为这一形式的主流，而这些工具条平时的开发当中重复量很大。JTooltips插件致力...
这个html的页面主要的实现页面的框架，拖动的效果，里面包含了javascript实现的代码，有助对于页面的document的盒子框架的属性的了解