jquery下div 的resize事件示例代碼
更新時(shí)間：2014年03月09日 16:46:02 作者：
這篇文章主要介紹了某位大神寫(xiě)的jquery下div 的resize事件,需要的朋友可以參考下
這是某位大神寫(xiě)的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(){ .. }); 了
復(fù)制代碼 代碼如下:
//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(){ .. }); 了
相關(guān)文章
jQuery實(shí)現(xiàn)復(fù)制到粘貼板功能
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)復(fù)制到粘貼板功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02
jquery實(shí)現(xiàn)的Banner廣告收縮效果代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)的Banner廣告收縮效果代碼,可實(shí)現(xiàn)點(diǎn)擊按鈕收縮與展開(kāi)廣告圖片的功能,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-09-09
使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法
這篇文章主要介紹了使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法,實(shí)例分析了Bootstrap TouchSpin插件的用法,是非常實(shí)用的技巧,需要的朋友可以參考下2015-01-01
JQuery 插件制作實(shí)踐 xMarquee插件V1.0
今天要介紹的是實(shí)現(xiàn)類(lèi)跑馬燈效果的的廣告插件。類(lèi)似偶公司web-dev的同事在網(wǎng)站首頁(yè)上做的目錄廣告播放器。其實(shí)很簡(jiǎn)單，LEVIN實(shí)際應(yīng)用中也用到,所以稍作整理如下.2010-04-04
輕量級(jí)jQuery插件slideBox實(shí)現(xiàn)帶底欄輪播(焦點(diǎn)圖)代碼
這篇文章主要介紹了輕量級(jí)jQuery插件slideBox實(shí)現(xiàn)帶底欄輪播(焦點(diǎn)圖)代碼，代碼簡(jiǎn)單易懂，非常實(shí)用，特此分享腳本之家平臺(tái)供大家學(xué)習(xí)2016-03-03
鼠標(biāo)移到導(dǎo)航當(dāng)前位置的LI變色處于選中狀態(tài)
本文所要實(shí)現(xiàn)的效果廣泛應(yīng)用于當(dāng)前導(dǎo)航,主要表現(xiàn)為鼠標(biāo)移到導(dǎo)航上面當(dāng)前的LI變色，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下，希望對(duì)大家有所幫助2013-08-08
jQuery插件FusionCharts實(shí)現(xiàn)的2D面積圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件FusionCharts實(shí)現(xiàn)的2D面積圖效果,結(jié)合完整實(shí)例形式分析了FusionCharts繪制2D面積圖的完整步驟與相關(guān)屬性設(shè)置操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
jQuery在iframe中無(wú)法彈出對(duì)話框的解決方法
如果在iframe中使用則彈不出對(duì)話框，而有時(shí)候我們還必須得使用iframe而不能用jQuery的load方式，下面有個(gè)不錯(cuò)的處理方法，希望對(duì)大家有所幫助2014-01-01
jQuery實(shí)現(xiàn)單擊和鼠標(biāo)感應(yīng)事件
這篇文章主要介紹了jQuery實(shí)現(xiàn)單擊和鼠標(biāo)感應(yīng)事件的方法的相關(guān)資料,需要的朋友可以參考下2015-02-02
jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09