jQuery之关于resize()方法的使用
作者：举个不听话的栗子
这篇文章主要介绍了jQuery之关于resize()方法的使用，具有很好的价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
jQuery resize() 方法使用
$(window).resize(function(){
$('span').text(x+=1);
})定义和用法
当调整浏览器窗口大小时，发生resize 事件。
resize() 方法触发 resize 事件，或规定当发生 focus 事件时运行的函数;
jQuery的resize方法扩展，支持window对象以外的dom元素
现在有一个需求，当窗口或者容器高度发生变化时，更新滚动条，滚动条插件使用的是 jQuery.NiceScroll，需要同时监听 window 对象 和 div 容器的 resize 事件。
事实上，jQuery 官方是有 $(window).resize() 事件的，只不过只能监听 window 对象，下面是方法代码，请在引入 jQuery 之后使用！
代码示例
// 监听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);使用方法：
$('#scrollBox').niceScroll();
$('#scrollBox').resize(function() {
// 容器尺寸发生变化后执行的事件
$('#scrollBox').getNiceScroll().resize();
})总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。