监听浏览器窗口大小的改变

<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;
}
alert(winHeight+","+winWidth);
}
findDimensions();
//调用函数,获取数值
window.onresize=findDimensions;
//-->
</script>

监听浏览器窗口大小的改变

时间: 2024-12-26 06:19:51

监听浏览器窗口大小的改变的相关文章

jquery如何监听浏览器窗口大小并根据不同的大小输出不同的值

1 $(window).bind("load resize",function(){ 2 document.documentElement.clientWidth >= 600 ? console.log("hello") : console.log("xiaoyu600") 3 }); 4 //第二种 5 $(window).bind("load resize",function(){ 6 if(document.do

【hugo】- hugo 监听浏览器切换title

hugo 博客 监听浏览器title 动态改变浏览器title标题 找到head.html themes/maupassant/layouts/partials/head.html 添加监听js 可以从html中发现,分为home页面和其他页面,两种展示的不同,所以需要改这两部分 {{ if .IsHome -}} <title>{{ .Site.Title }} | {{ .Site.Params.subtitle}}</title> <meta property=&quo

时时监听input内容的改变

心得:我们都知道inoput有一个change事件,但是是在input元素失去焦点的时候发生,不能时时的监听input内容的改变. 刚开始的时候我是想用setInterval设置计时器的原理定时监听input内容的改变,但是结果差强人意,效果一点也不好,有时候操做过快还会出现undefined的情况. 解决方法:通过阅读资料了解到input有意的input事件在大多当今主流的浏览器都能实现对input输入内容的时时监听: <input id="test"/> $("

js 监听浏览器刷新还是关闭事件

原作者的文章地址:http://udn.yyuap.com/forum.php?mod=viewthread&tid=96309 页面加载时只执行onload 页面关闭时只执行onunload 页面刷新时先执行onbeforeunload,然后onunload,最后onload. 经过验证我得出的结论是: //对于ie,谷歌,360: //页面加载时只执行onload //页面刷新时,刷新之前执行onbeforeunload事件,在新页面即将替换旧页面时onunload事件,最后onload事件

Android学习笔记二十二.使用ContentProvider实现数据共享(五).监听ContentProvider的数据改变

一.使用ContentProvider管理多媒体内容 Android提供了Camera程序来支持拍照.拍摄视频,用户拍摄的相片.视频都将存放在固定的位置.Android同样为这些多媒体内容提供了ContentProvider,所以我们可以通过使用ContentProvider实现其他应用直接访问Camera所拍摄的照片.视频等. 1.多媒体ContentProvider的Uri (1)MediaStore.Audio.Media.EXTERNAL_CONTENT_URI:存储在外部存储器(SD卡

17.swift怎么监听该属性的改变

import UIKit class Person : NSObject { var name : String? { // 可以给newValue自定义名称 willSet (new){ // 属性即将改变,还未改变时会调用的方法 // 在该方法中有一个默认的系统属性newValue,用于存储新值 print(name) print(new) } // 可以给oldValue自定义名称 didSet (old) { // 属性值已经改变了,会调用的方法 // 在该方法中有一个默认的系统属性ol

监听浏览器后退事件,使其转向指定URL

$(function(){ //清空浏览器历史记录 pushHistory(); //监听浏览器后退事件 window.addEventListener("popstate", function(e) { //转向指定的URL location.href=url; }, false); //清空浏览器历史记录 function pushHistory() { var url = "#"; var state = { title: "title",

JS 监听浏览器标签页显示隐藏

JS 监听浏览器标签页显示隐藏 API document.hidden 判断页面是否隐藏的布尔值.页面隐藏包括 页面在后台标签页中 或者 浏览器最小化 document.visibilityState (只读属性), 返回document的可见性,4个值: hidden:文档处于背景标签页或者窗口处于最小化状态,或者操作系统正处于 '锁屏状态' visible:此页面在前景标签页中,并且窗口没有最小化 prerender:页面在屏幕外执行预渲染处理 document.hidden 的值为 tru

监听浏览器返回键、后退、上一页事件(popstate)操作返回键

在WebApp或浏览器中,会有点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面.确认离开页面或执行一些其它操作的需求.可以使用 popstate 事件进行监听返回.后退.上一页操作. 一.简单介绍 history 中的操作 1.window.history.back(),后退 2.window.history.forward(),前进 3.window.history.go(num),前进或后退指定数量历史记录 4.window.history.pushState(state, t