zoukankan      html  css  js  c++  java
  • 监听某个div或其它标签的大小改变来执行相应的处理

    jquery 默认的resize只能监听到浏览器窗口大小的改变,但我们在实际使用过程中有可能还需要监听某个div或其它标签的大小改变来执行相应的处理,如果使用默认的resize就无能为力了。怎么办呢,这里给大家推荐一个jquery的小插件,相当于是对默认的resize事件的增强版本jquery 默认的resize只能监听到浏览器窗口大小的改变,但我们在实际使用过程中有可能还需要监听某个div或其它标签的大小改变来执行相应的处理,如果使用默认的resize就无能为力了。怎么办呢,这里给大家推荐一个jquery的小插件,相当于是对默认的resize事件的增强版本,它可以监听几乎所有标签的大小改变来做相应的处理。 将以下代码复制到你的js文件中

    (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(function(){...}); 来实现监听 id为div元素的尺寸改变时做相应的逻辑处理。
  • 相关阅读:
    WPF数据绑定之4种绑定模式
    MVVM弹出提示
    MVVM 事件汇总
    C#读取数据库返回泛型集合 把DataSet类型转换为List泛型集合
    WINFORM 父窗体Load事件中打开子窗体并关闭自身
    常用正则表达式
    GridView密技#3GridView合并储存格后,隔列变底色(AlternatingRowStyle)
    自己动手写的版本 网站的 Detail程序 (DataReader)
    [入门] 双重关联 下拉式选单(DropDownList)
    GridView密技#2GridView合并储存格
  • 原文地址:https://www.cnblogs.com/yuanxiaoping_21cn_com/p/3449929.html
Copyright © 2011-2022 走看看