jQuery监听浏览器窗口大小的变化实例


Posted in Javascript onFebruary 07, 2017

方法一:在标签上加入  onLoad="" onResize=""  方法  写上对应的方法即可

方法二:window.onresize=function(){///.....} 在方法里面写上对应的代码即可

着两种方法基本都可以解决问题。

<script>
function adjust(obj){
  var div = document.getElementById("pad");
  var txt = document.getElementById("txt");
  var w = document.body.clientWidth;
  var h = document.body.clientHeight;
  div.style.width = w/3;
  div.style.height = h/3;
  txt.style.width = w/6;
  txt.style.height = h/6;
}
window.onload=function(){
 window.onresize = adjust;
 adjust();
}
</script>
<body style="margin:0px;height:0px;">
<div id="pad" style="background:red;zoom:1;margin:0px;height:0px;">
  <input type="text" id="txt">
</div>
</body>

以上这篇jQuery监听浏览器窗口大小的变化实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用JavaScript编写COM组件的步骤
Mar 17 Javascript
jQuery 数据缓存data(name, value)详解及实现
Jan 04 Javascript
javascript 模式设计之工厂模式详细说明
May 10 Javascript
JavaScript设计模式之单例模式实例
Sep 24 Javascript
javascript中Number对象的toString()方法分析
Dec 20 Javascript
javascript实现的图片切割多块效果实例
May 07 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
Aug 01 Javascript
提高JavaScript执行效率的23个实用技巧
Mar 01 Javascript
简单实现jQuery手风琴效果
Aug 18 jQuery
vue项目优化之通过keep-alive数据缓存的方法
Dec 11 Javascript
js实现登录拖拽窗口
Feb 10 Javascript
JS跨浏览器解析XML应用过程详解
Oct 16 Javascript
Bootstrap table表格简单操作
Feb 07 #Javascript
Jquery根据浏览器窗口改变调整大小的方法
Feb 07 #Javascript
对比分析Django的Q查询及AngularJS的Datatables分页插件
Feb 07 #Javascript
jquery 判断是否支持Placeholder属性的方法
Feb 07 #Javascript
深入理解JavaScript中的for循环
Feb 07 #Javascript
vue实现ToDoList简单实例
Feb 07 #Javascript
js Canvas绘制圆形时钟教程
Feb 06 #Javascript
You might like
一个程序下载的管理程序(二)
2006/10/09 PHP
用PHP和ACCESS写聊天室(六)
2006/10/09 PHP
PHP 设置MySQL连接字符集的方法
2011/01/02 PHP
JS中使用Array函数shift和pop创建可忽略参数的例子
2014/05/28 Javascript
js中匿名函数的创建与调用方法分析
2014/12/19 Javascript
JSON 对象未定义错误的解决方法
2016/09/29 Javascript
jquery实现下拉框左右选择功能
2017/02/21 Javascript
easyui-edatagrid.js实现回车键结束编辑功能的实例
2017/04/12 Javascript
js自定义瀑布流布局插件
2017/05/16 Javascript
解决vue-cli webpack打包后加载资源的路径问题
2018/09/25 Javascript
element ui table(表格)实现点击一行展开功能
2018/12/04 Javascript
vue.js仿hover效果的实现方法示例
2019/01/28 Javascript
PostgreSQL Node.js实现函数计算方法示例
2019/02/12 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
2019/06/21 Javascript
Servlet返回的数据js解析2种方法
2019/12/12 Javascript
vscode 使用Prettier插件格式化配置使用代码详解
2020/08/10 Javascript
Python定时执行之Timer用法示例
2015/05/27 Python
python3+PyQt5重新实现自定义数据拖放处理
2018/04/19 Python
python实现最小二乘法线性拟合
2019/07/19 Python
Python 获取项目根路径的代码
2019/09/27 Python
python做接口测试的必要性
2019/11/20 Python
使用python创建生成动态链接库dll的方法
2020/05/09 Python
戴森美国官网:Dyson美国
2016/09/11 全球购物
优质飞蝇钓和渔具:RiverBum
2020/05/10 全球购物
西安众合通用.net笔试题
2013/03/18 面试题
总经理岗位职责范本
2014/02/02 职场文书
实习会计求职自荐信范文
2014/03/10 职场文书
节约用水标语
2014/06/11 职场文书
授权委托书(法人单位用)
2014/09/29 职场文书
党员个人批评与自我批评
2014/10/14 职场文书
自主招生英文自荐信
2015/03/25 职场文书
党小组推荐意见
2015/06/02 职场文书
超市店长竞聘书
2015/09/15 职场文书
志愿者服务宣传标语口号
2015/12/26 职场文书
2019年怎样写好导游词?
2019/07/02 职场文书
开机音效回归! Windows 11重新引入开机铃声
2021/11/21 数码科技