<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>请调整浏览器窗口</title> <meta http-equiv="content-type" content="text/html>
</meta></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>

js获取浏览器宽度和高度值的更多相关文章

  1. JS获取各种宽度、高度的简单介绍:

    JS获取各种宽度.高度的简单介绍: scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获 ...

  2. JS 获取各个宽度和高度

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  3. JS动态获取浏览器宽度和高度

    $(window).resize(function() { var width = $(this).width(); var height = $(this).height(); });

  4. js获取窗口宽度、高度

    1.获取屏幕的高度和宽度(屏幕分辨率): window.screen.height window.screen.width 2.获取屏幕工作区域的高度和宽度(去掉状态栏): window.screen ...

  5. JS 获取浏览器和屏幕宽高等信息代码

    JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:doc ...

  6. js获取浏览器高度和宽度值,尽量的考虑了多浏览器。

    js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...

  7. 【转】js 获取浏览器高度和宽度值(多浏览器

    原文地址:http://www.jb51.net/article/19844.htm js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ...

  8. js 获取浏览器显示内容的宽度和高度

      js获取浏览器显示内容的宽度和高度 CreateTime--2017年7月10日17:24:12Author:Marydon 1.获取浏览器屏幕显示d的网页宽度 /** * 得到浏览器显示的屏幕高 ...

  9. js获取浏览器高度

    常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...

  10. js获取浏览器当前窗口的高度长度

    js获取浏览器可见区域(不包括标题栏.地址栏.收藏夹栏状态栏等额外区域,仅为页面呈现区域)的高度和宽度宽度:document.documentElement.clientWidth高度:documen ...

随机推荐

  1. Qt对象跨线程出现的问题记录,以及解决方案

    Qt在跨线程开发的时候可能会出现不少问题,在这里记录一下 Qt目前用下来还是非常强大的,虽然只是用在桌面端程序开发上,但是其强大的桌面开发库真的挺好用的(Layout除外,你妈死了). Qt除了UI, ...

  2. 使用APICloud AVM多端组件快速实现app中的搜索功能

    很多 APP 中都有搜索功能的需求,本文介绍怎么使用 avm 多端组件快速实现搜索功能. 在 APICloud 模块库搜索 animate-UISearchBar,添加到项目.多端组件需要下载源码,引 ...

  3. 饮料换购【第六届蓝桥杯省赛C++A/C组,第六届蓝桥杯省赛JAVAB组】

    饮料换购 乐羊羊饮料厂正在举办一次促销优惠活动.乐羊羊C型饮料,凭3个瓶盖可以再换一瓶C型饮料,并且可以一直循环下去(但不允许暂借或赊账). 请你计算一下,如果小明不浪费瓶盖,尽量地参加活动,那么,对 ...

  4. ClickHouse(11)ClickHouse合并树MergeTree家族表引擎之SummingMergeTree详细解析

    目录 建表语法 数据处理 汇总的通用规则 AggregateFunction 列中的汇总 嵌套结构数据的处理 资料分享 参考文章 SummingMergeTree引擎继承自MergeTree.区别在于 ...

  5. 【学习笔记】Splay

    \(\texttt{0x01}\) 前言 Splay 树(伸展树)是一棵二叉搜索树,由 Daniel Sleator 和 Robert Tarjan 于 1985 年发明.它凭借旋转可以有 $O(\l ...

  6. maven依赖管理,生命周期,插件

    依赖配置 依赖指当前项目运行所需的jar,一个项目可以设置多个依赖,在pom.xml中格式如下 <!--设置当前项目所依赖的所有jar--> <dependencies> &l ...

  7. 一幅图像为f=[1 4 7;2 5 8;3 6 9],设kx=1.8,ky=1.3,试采用最邻近插值对其进行放大,写出新图像矩阵。

    一幅图像为f=[1 4 7;2 5 8;3 6 9],设kx=1.8,ky=1.3,试采用最邻近插值对其进行放大,写出新图像矩阵.(请写出解题步骤,并编写程序进行结果验证) 参考 matlab代码如下 ...

  8. 使用 flexible.js + rem 制作苏宁移动端首页

    一.技术选型 二.搭建相关文件夹 三.设置视口标签以及引入初始化样式文件和js文件 四.body 样式 五.rem 适配方案二 body样式修改 index.css body { min-width: ...

  9. 完整工作流整合方案,自定义配置,Java+Vue+Activiti@附配套文档

    前言 activiti工作流引擎项目,企业erp.oa.hr.crm等企事业办公系统轻松落地,一套完整并且实际运用在多套项目中的案例,满足日常业务流程审批需求. 一.项目形式 springboot+v ...

  10. python学习第四周总结

    异常常见类型 异常处理语法结构 异常补充处理 异常处理实战应用 生成器对象 自定义生成器range()功能 yield冷门用法 生成器表达式 模块简介 模块的分类 导入模块的两种句式 导入模块补充说明 ...