在 JavaScript 中,resize 事件是在浏览器窗口被重置时触发的,如当用户调整窗口大小,或者最大化、最小化、恢复窗口大小显示时触发 resize 事件。利用该事件可以跟踪窗口大小的变化以便动态调整页面元素的显示大小。

示例

下面的示例能够根据跟踪窗口大小变化及时调整页面内红色盒子的大小,使其始终保持与窗口固定比例的大小显示。

var box = document.getElementById("box"); //获取盒子的指针引用

box.style.position = "absolute"; //绝对定位

box.style.backgroundColor = "red"; //背景色

box.style.width = w() * 0.8 + "px"; //设置盒子宽度为窗口宽度的0.8倍

box.style.height = h() * 0.8 + "px"; //设置盒子高度为窗口高度的0.8倍

window.onresize = function () { //注册事件处理函数,动态调整盒子大小

box.style.width = w() * 0.8 + "px";

box.style.height = h() * 0.8 + "px";

}

function w () { //获取窗口宽度

if (window.innerWidth) { //兼容DOM

return window.innerWidth;

else if ((document.body) && (document.body.clientWidth)) //兼容IE

return document.body.clientWidth;

}

function h () { //获取窗口高度

if (window.innerHeight) { //兼容DOM

return window.innerHeight;

else if ((document.body) && (document.body.clientHeight)) //兼容IE

return document.body.clientHeight;

}

matlab重置矩阵大小resize,JS resize事件:窗口重置相关推荐

  1. html弹窗页面控制大小,使用JS弹出新窗口,并设置窗口的大小和位置等相关属性,传递参数...

    使用JS弹出新窗口,同时向弹出的页面传递一个参数. 首先,使用JS获取需要传递的参数.然后将参数传入心得页面. window.open 弹出新窗口的命令: page.html 弹出新窗口的文件名: n ...

  2. Matlab求矩阵大小

    size(a) size(a,1)列数 size(a,2)行数 length行数和列数中较大的值 isempty判断矩阵是否为空 numel统计矩阵中元素的个数

  3. MATLAB限制矩阵大小,matlab – 如何将矩阵划分为不等大小的子矩阵?

    这是使用函数 linspace, round和 diff的简单解决方案: [M, N] = size(mat); % Matrix size nSub = 10; % Number of submat ...

  4. matlab 改变矩阵大小,matlab编程 左边和右边的矩阵大小不匹配,导致不能直接赋值...

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 clear all n=input(*摩尔数*); p(1)=input(*压强*); v(1)=input(*体积*); R=8.314; r=1.4; ...

  5. js监听html页面大小变化,JS监听窗口变化实时获取浏览器窗口大小

    原理:通过监听窗口的变化来动态获取窗口大小 用到的方法:addEventListener() 监听window的resize事件 js代码: // 定义事件侦听器函数 function watchWi ...

  6. opencv3_java 修改图像大小Resize Imgproc.resize

    修改图像大小Resize Imgproc.resize package opencv_java_demo;import org.opencv.core.*; import org.opencv.img ...

  7. 调整谷歌reCAPTCHA大小 How to resize the Google noCAPTCHA reCAPTCHA

    最近调试reCAPTCHA的时候,发现手机版的reCAPTCHA会不适应大小: 经修改后应该为: 代码如下: .g-recaptcha {transform:scale(0.77);-webkit-t ...

  8. 使用Matlab对矩阵元素进行大小排序(开源)

    使用Matlab对整个矩阵元素进行大小排序,排序后的矩阵大小与原矩阵一样,按照左上最小,右下最大排列或者左上最大,右下最小排列. 代码如下: clc; clear; %%%%%%%%%%%%%%%%% ...

  9. MATLAB学习笔记#001 获取矩阵大小

    MATLAB学习笔记#001 获取矩阵大小 size 函数 语法 说明 示例 参考链接 size 函数 语法 [sz1,...,szN] = size(___) 说明 返回矩阵各个维度的长度 示例 [ ...

最新文章

  1. File-nodejs
  2. 程序员如何解决工作中的技术问题?
  3. python实现lenet_吴裕雄 python 神经网络TensorFlow实现LeNet模型处理手写数字识别MNIST数据集...
  4. 【转】为控制台窗口建立消息队列
  5. SpringMVC核心——视图渲染(包含视图解析)问题
  6. Faied to run MSBuild commond CmakeError
  7. 10分钟带你读完人工智能的三生三世
  8. Access denied for user ''@'localhost' to database 'mysql‘’
  9. 十九. 用户注册 --- 短信验证码实现 2021-04-16
  10. 技术笔记:Indy IdSMTP支持腾讯QQ邮箱邮件发送
  11. 会员注册与验证码demo 带注释(html、css、js)
  12. 关闭springboot健康检查 org.springframework.boot.actuate.health.AbstractHealthIndicator 89 health - Elastic
  13. 已更新或删除的行值要么不能使该行成为唯一行
  14. 施工工地考勤防作弊通道系统,建筑工地通道系统管理方案
  15. Win10任务栏图标无法右键/取消固定
  16. php 获取 所有上级 id,z-blog获取分类以及上级分类的代码
  17. 2015十大CMS系统介绍
  18. Fall 2020 Berkeley cs61a Hog Project
  19. 怎么扩大esp分区和传统引导转UEFI引导教程
  20. 哈佛梅森学者:数字加密货币的泡沫与机遇|万字长文干货

热门文章

  1. dict取值_Python基础数据类型「list、tuple、dict」
  2. add git 指定类型文件夹_UE4 使用git配合远程仓库
  3. python sort 多级排序_Python使用sort和class实现的多级排序功能示例
  4. 分布式架构的前世今生...
  5. 3984: 玩具(toy)
  6. 机器视觉和Tesseract
  7. Java线程池理解及用法
  8. Nginx的nginx.conf配置文件中文注释说明
  9. jsp页面点击显示影藏div的一个方法
  10. 作业四-结队编程项目-四则运算