jquery下div 的resize事件示例代码


Posted in Javascript onMarch 09, 2014

这是某位大神写的jquery下div 的resize事件。

//resize of div 
(function($, h, c) { 
var a = $([]), 
e = $.resize = $.extend($.resize, {}), 
i, 
k = "setTimeout", 
j = "resize", 
d = j + "-special-event", 
b = "delay", 
f = "throttleWindow"; 
e[b] = 250; 
e[f] = true; 
$.event.special[j] = { 
setup: function() { 
if (!e[f] && this[k]) { 
return false; 
} 
var l = $(this); 
a = a.add(l); 
$.data(this, d, { 
w: l.width(), 
h: l.height() 
}); 
if (a.length === 1) { 
g(); 
} 
}, 
teardown: function() { 
if (!e[f] && this[k]) { 
return false; 
} 
var l = $(this); 
a = a.not(l); 
l.removeData(d); 
if (!a.length) { 
clearTimeout(i); 
} 
}, 
add: function(l) { 
if (!e[f] && this[k]) { 
return false; 
} 
var n; 
function m(s, o, p) { 
var q = $(this), 
r = $.data(this, d); 
r.w = o !== c ? o: q.width(); 
r.h = p !== c ? p: q.height(); 
n.apply(this, arguments); 
} 
if ($.isFunction(l)) { 
n = l; 
return m; 
} else { 
n = l.handler; 
l.handler = m; 
} 
} 
}; 
function g() { 
i = h[k](function() { 
a.each(function() { 
var n = $(this), 
m = n.width(), 
l = n.height(), 
o = $.data(this, d); 
if (m !== o.w || l !== o.h) { 
n.trigger(j, [o.w = m, o.h = l]); 
} 
}); 
g(); 
}, 
e[b]); 
} 
})(jQuery, this);

这样就可以 $('div').resize(fucntion(){ .. }); 了
Javascript 相关文章推荐
JavaScript prototype属性使用说明
May 13 Javascript
用JavaScript玩转游戏物理(一)运动学模拟与粒子系统
Jun 19 Javascript
分享14个很酷的jQuery导航菜单插件
Apr 25 Javascript
Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
Nov 14 Javascript
JavaScript网页定位详解
Jan 13 Javascript
Ext GridPanel加载完数据后进行操作示例代码
Jun 17 Javascript
javascript倒计时效果实现
Nov 12 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
Dec 20 Javascript
聊聊鉴权那些事(推荐)
Aug 22 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
Sep 28 Javascript
vue路由跳转传递参数的方式总结
May 10 Javascript
使用React代码动态生成栅格布局的方法
May 24 Javascript
现如今最流行的JavaScript代码规范
Mar 08 #Javascript
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
Mar 08 #Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
Mar 08 #Javascript
JS实现鼠标单击与双击事件共存
Mar 08 #Javascript
js触发onchange事件的方法说明
Mar 08 #Javascript
关于onchange事件在IE和FF下的表现及解决方法
Mar 08 #Javascript
javascript中的事件代理初探
Mar 08 #Javascript
You might like
php正则表达式(regar expression)
2011/09/10 PHP
PHP设计模式之装饰者模式
2012/02/29 PHP
PHP使用SOAP调用.net的WebService数据
2013/11/12 PHP
php实现的微信红包算法分析(非官方)
2015/09/25 PHP
如何离线执行php任务
2017/02/21 PHP
ThinkPHP框架分布式数据库连接方法详解
2017/03/14 PHP
PHP新特性详解之命名空间、性状与生成器
2017/07/18 PHP
jQuery判断checkbox是否选中的小例子
2013/12/02 Javascript
通过JS来动态的修改url,实现对url的增删查改
2014/09/01 Javascript
JavaScript访问字符串中单个字符的两种方法
2015/07/03 Javascript
PHP实现本地图片上传和验证功能
2017/02/27 Javascript
js图片轮播插件的封装
2017/07/21 Javascript
使用veloticy-ui生成文字动画效果
2018/02/08 Javascript
快速了解vue-cli 3.0 新特性
2018/02/28 Javascript
jQuery超简单遮罩层实现方法示例
2018/09/06 jQuery
移动端图片上传旋转、压缩问题的方法
2018/10/16 Javascript
微信小程序 授权登录详解(附完整源码)
2019/08/23 Javascript
js实现移动端tab切换时下划线滑动效果
2019/09/08 Javascript
通过angular CDK实现页面元素拖放的步骤详解
2020/07/01 Javascript
Javascript var变量删除原理及实现
2020/08/26 Javascript
[01:10:58]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
python Django框架实现自定义表单提交
2016/03/25 Python
Python计算字符宽度的方法
2016/06/14 Python
python 常见字符串与函数的用法详解
2018/11/23 Python
Python实现计算长方形面积(带参数函数demo)
2020/01/18 Python
jupyter 中文乱码设置编码格式 避免控制台输出的解决
2020/04/20 Python
Python应用实现处理excel数据过程解析
2020/06/19 Python
Python json格式化打印实现过程解析
2020/07/21 Python
Pycharm Git 设置方法
2020/09/15 Python
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
CSS 说明横向进度条最后显示文字的实现代码
2020/11/10 HTML / CSS
幼儿园评语大全
2014/04/17 职场文书
小学数学课后反思
2014/04/23 职场文书
内勤岗位职责范本
2015/04/13 职场文书
2015年化妆品销售工作总结
2015/05/11 职场文书
新闻稿标题
2015/07/18 职场文书