<!DOCTYPE html>

<html>

<head>

    <title>请调整浏览器窗口</title>

    <meta charset="UTF-8">

</head>

<body>

    <h2 align="center">请调整浏览器窗口大小</h2>

    <hr>

    <form action="#" method="get" name="form1" id="form1">

        <!-- 显示浏览器窗口的实际尺寸 -->

        浏览器窗口的实际高度: <input  id="height" type="text" name="availHeight" size="4"><br>

        浏览器窗口的实际宽度: <input  id="width"  type="text" name="availWidth"  size="4"><br>

    </form>

    <script>

        document.getElementById('height').value = window.outerHeight + "px";

        document.getElementById('width').value = window.outerWidth + "px";

        window.onresize=function(){

            document.getElementById('height').value = window.outerHeight + "px";

            document.getElementById('width').value = window.outerWidth + "px";

        };

    </script>

</body>

</html>

window.onresize使用实例的更多相关文章

  1. window.onresize事件

    定义和用法 onresize 事件会在窗口或框架被调整大小时发生. 语法 In HTML: <element onresize="SomeJavaScriptCode"> ...

  2. window.onresize 多次触发的解决方法

    用了window.onresize但是发现每次 onresize 后页面中状态总是不对,下面与大家分享下onresize 事件多次触发的解决方法. 之前做一个扩展,需要在改变窗口大小的时候保证页面显示 ...

  3. Vue：window.onresize

    1. 添加属性screenHeight 和 timer. screenHeight: window.innerHeight timer: '' //  window.onresize函数频繁调用时,页 ...

  4. 关于window.onresize

    window.ss1 = function() { alert("aaa") } window.ss = function() { alert("bbb") } ...

  5. window.onresize监听事件

    window.onresize监听事件 onresize 事件会在窗口或框架被调整大小时发生. 支持onresize的标签:<a>, <address>, <b>, ...

  6. window.onresize事件在vue项目中的应用

    //vue页面<template> <div id='echart'> 报表 </div> </template> <script> exp ...

  7. Echarts同一页面多个图表自适应浏览器窗口大小——window.onresize

    当前做的一个项目中,频繁使用到百度团队的Echarts,发在一个页面同时出现多个图表时,只有最后一个图表触发了window.onresize事件,查询官方文档后得到解决. 方法如下: hwChart. ...

  8. window.onresize 事件笔记

     1.浏览器尺寸变化响应事件 : window.onresize = function(){....} 这里须要注意的是,onresize响应事件处理中.获取到的页面尺寸參数是变更后的參数. // ...

  9. 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize

    1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...

随机推荐

  1. Mac中安装Git

    Mac 安装git 打开Mac终端输入git命令 如果出现以下代码说明已经安装 usage: git [--version] [--help] [-C <path>] [-c <na ...

  2. SQL Server和Oracle数据类型对应关系

    在工作中,有时会遇到跨库传输数据的情况,其中 SQL Server 和 Oracle 之间的数据传输是比较常见的情况. 因为 SQL Server 和 Oracle 的数据类型有些差异,这就要求我们在 ...

  3. linux总线

    编写驱动程序: 1 #include <linux/init.h> 2 #include <linux/module.h> 3 #include <linux/devic ...

  4. jackson学习之四：WRAP_ROOT_VALUE（root对象）

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  5. “batteries included” philosophy

    https://docs.djangoproject.com/en/2.2/ref/contrib/ contrib packages Django aims to follow Python's & ...

  6. Map转换为格式化的YAML字符串

    yaml与java对象的互转 yaml与java对象的互转有snakeyaml <dependency> <groupId>org.yaml</groupId> & ...

  7. Java Socket InetAddress类 Socket DatagramPacket TCP、UDP示例

    java.net :为实现网络应用程序提供类. InetAddress类 方法摘要 方法摘要 boolean equals(Object obj) : 将此对象与指定对象比较. byte[] getA ...

  8. （七）整合 Redis集群 ,实现消息队列场景

    整合 Redis集群 ,实现消息队列场景 1.Redis集群简介 1.1 RedisCluster概念 2.SpringBoot整合Redis集群 2.1 核心依赖 2.2 核心配置 2.3 参数渲染 ...

  9. 2.centos 7清空文件和文件夹

    1.清空文件 测试文件:a.txt 1)方法一,[root@centos test]# > a.txt [root@centos test]# cat a.txt 1hjbfao hjkl23o ...

  10. （24）bzip2命令：压缩文件（.bz2格式）&&bunzip2命令：bz2格式的解压缩命令

    1.bzip2 命令同 gzip 命令类似,只能对文件进行压缩(或解压缩),对于目录只能压缩(或解压缩)该目录及子目录下的所有文件.当执行压缩任务完成后,会生成一个以".bz2"为 ...