relatively-sticky

A jQuery plugin for creating smart sticky elements
git clone https://git.ce9e.org/relatively-sticky.git

commit
a38153228a8a2bc1ac69eccf35b0b8833521927d
parent
82be7bf6a12c30cdbbdaf1d5febe9735e9452879
Author
leaf corcoran <leafot@gmail.com>
Date
2014-11-11 00:05
add attach/detach test buttons, rebuild

Diffstat

M jquery.sticky-kit.js 6 ++++--
M jquery.sticky-kit.min.js 12 ++++++------
M test/index.html 34 ++++++++++++++++++++++++----------

3 files changed, 34 insertions, 18 deletions


diff --git a/jquery.sticky-kit.js b/jquery.sticky-kit.js

@@ -1,7 +1,7 @@
    1     1 // Generated by CoffeeScript 1.8.0
    2     2 
    3     3 /**
    4    -1 @license Sticky-kit v1.0.4 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
   -1     4 @license Sticky-kit v1.0.5 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    5     5  */
    6     6 
    7     7 (function() {
@@ -190,7 +190,9 @@
  190   190         parent.position("position", "");
  191   191         if (fixed) {
  192   192           if (manual_spacer == null) {
  193    -1             elm.insertAfter(spacer);
   -1   193             if (el_float === "left" || el_float === "right") {
   -1   194               elm.insertAfter(spacer);
   -1   195             }
  194   196             spacer.remove();
  195   197           }
  196   198           return elm.removeClass(sticky_class);

diff --git a/jquery.sticky-kit.min.js b/jquery.sticky-kit.min.js

@@ -1,8 +1,8 @@
    1     1 /*
    2    -1  Sticky-kit v1.0.4 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
   -1     2  Sticky-kit v1.0.5 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    3     3 */
    4    -1 (function(){var b,n;b=this.jQuery||window.jQuery;n=b(window);b.fn.stick_in_parent=function(d){var v,p,q,f,r,C,m,D;null==d&&(d={});r=d.sticky_class;v=d.inner_scrolling;f=d.parent;q=d.offset_top;p=d.spacer;null==q&&(q=0);null==f&&(f=void 0);null==v&&(v=!0);null==r&&(r="is_stuck");C=function(a,d,m,w,z,s,u){var t,A,l,x,c,e,B,y,g,h;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);e=a.parent();null!=f&&(e=e.closest(f));if(!e.length)throw"failed to find stick parent";t=l=!1;g=null!=p?a.closest(p):b("<div />");
    5    -1 g.css("position",a.css("position"));B=function(){var c,b,k;c=parseInt(e.css("border-top-width"),10);b=parseInt(e.css("padding-top"),10);d=parseInt(e.css("padding-bottom"),10);m=e.offset().top+c+b;w=e.height();l&&(t=l=!1,null==p&&(a.insertAfter(g),g.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(r),k=!0);z=a.offset().top-parseInt(a.css("margin-top"),10)-q;s=a.outerHeight(!0);u=a.css("float");g.css({width:a.outerWidth(!0),height:s,display:a.css("display"),"vertical-align":a.css("vertical-align"),
    6    -1 "float":u});if(k)return h()};B();if(s!==w)return x=void 0,c=q,h=function(){var b,h,k,f;k=n.scrollTop();null!=x&&(h=k-x);x=k;l?(f=k+s+c>w+m,t&&!f&&(t=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom")),k<z&&(l=!1,c=q,null==p&&("left"!==u&&"right"!==u||a.insertAfter(g),g.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(r).trigger("sticky_kit:unstick")),v&&(b=n.height(),s>b&&!t&&(c-=h,c=Math.max(b-s,c),c=Math.min(q,c),l&&a.css({top:c+"px"})))):k>z&&(l=!0,b={position:"fixed",
    7    -1 top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(r),null==p&&(a.after(g),"left"!==u&&"right"!==u||g.append(a)),a.trigger("sticky_kit:stick"));if(l&&(null==f&&(f=k+s+c>w+m),!t&&f))return t=!0,"static"===e.css("position")&&e.css({position:"relative"}),a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},y=function(){B();return h()},A=function(){n.off("scroll",h);b(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",
    8    -1 A);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:""});e.position("position","");if(l)return null==p&&(a.insertAfter(g),g.remove()),a.removeClass(r)},n.on("touchmove",h),n.on("scroll",h),n.on("resize",y),b(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",A),setTimeout(h,0)}};m=0;for(D=this.length;m<D;m++)d=this[m],C(b(d));return this}}).call(this);
   -1     4 (function(){var b,p;b=this.jQuery||window.jQuery;p=b(window);b.fn.stick_in_parent=function(d){var v,q,r,f,s,C,m,D;null==d&&(d={});s=d.sticky_class;v=d.inner_scrolling;f=d.parent;r=d.offset_top;q=d.spacer;null==r&&(r=0);null==f&&(f=void 0);null==v&&(v=!0);null==s&&(s="is_stuck");C=function(a,d,m,w,z,t,n){var u,A,l,x,c,e,B,y,g,h;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);e=a.parent();null!=f&&(e=e.closest(f));if(!e.length)throw"failed to find stick parent";u=l=!1;g=null!=q?a.closest(q):b("<div />");
   -1     5 g.css("position",a.css("position"));B=function(){var c,b,k;c=parseInt(e.css("border-top-width"),10);b=parseInt(e.css("padding-top"),10);d=parseInt(e.css("padding-bottom"),10);m=e.offset().top+c+b;w=e.height();l&&(u=l=!1,null==q&&(a.insertAfter(g),g.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(s),k=!0);z=a.offset().top-parseInt(a.css("margin-top"),10)-r;t=a.outerHeight(!0);n=a.css("float");g.css({width:a.outerWidth(!0),height:t,display:a.css("display"),"vertical-align":a.css("vertical-align"),
   -1     6 "float":n});if(k)return h()};B();if(t!==w)return x=void 0,c=r,h=function(){var b,h,k,f;k=p.scrollTop();null!=x&&(h=k-x);x=k;l?(f=k+t+c>w+m,u&&!f&&(u=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom")),k<z&&(l=!1,c=r,null==q&&("left"!==n&&"right"!==n||a.insertAfter(g),g.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(s).trigger("sticky_kit:unstick")),v&&(b=p.height(),t>b&&!u&&(c-=h,c=Math.max(b-t,c),c=Math.min(r,c),l&&a.css({top:c+"px"})))):k>z&&(l=!0,b={position:"fixed",
   -1     7 top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(s),null==q&&(a.after(g),"left"!==n&&"right"!==n||g.append(a)),a.trigger("sticky_kit:stick"));if(l&&(null==f&&(f=k+t+c>w+m),!u&&f))return u=!0,"static"===e.css("position")&&e.css({position:"relative"}),a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},y=function(){B();return h()},A=function(){p.off("scroll",h);b(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",
   -1     8 A);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:""});e.position("position","");if(l)return null==q&&("left"!==n&&"right"!==n||a.insertAfter(g),g.remove()),a.removeClass(s)},p.on("touchmove",h),p.on("scroll",h),p.on("resize",y),b(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",A),setTimeout(h,0)}};m=0;for(D=this.length;m<D;m++)d=this[m],C(b(d));return this}}).call(this);

diff --git a/test/index.html b/test/index.html

@@ -81,6 +81,8 @@
   81    81 <body>
   82    82 
   83    83 <div class="buttons">
   -1    84   <button class="attach">Attach</button>
   -1    85   <button class="detach">Detach</button>
   84    86   <button class="recalc">Recalc</button>
   85    87 </div>
   86    88 
@@ -214,12 +216,16 @@
  214   216       });
  215   217     }
  216   218 
  217    -1     $(".container .item:not(.use_manual)").stick_in_parent();
   -1   219     function attach() {
   -1   220       $(".container .item:not(.use_manual)").stick_in_parent();
  218   221 
  219    -1     $(".container .item.use_manual").stick_in_parent({
  220    -1       parent: ".container",
  221    -1       spacer: ".manual_spacer"
  222    -1     });
   -1   222       $(".container .item.use_manual").stick_in_parent({
   -1   223         parent: ".container",
   -1   224         spacer: ".manual_spacer"
   -1   225       });
   -1   226     }
   -1   227 
   -1   228     attach();
  223   229 
  224   230     $("#events_container").on("sticky_kit:stick", function(e) {
  225   231       $(e.target).html("got stick event");
@@ -237,11 +243,19 @@
  237   243       $(e.target).html("got unbottom event");
  238   244     });
  239   245 
  240    -1     $(document.body).on("click", ".recalc", function() {
  241    -1       console.log("Triggering recalc");
  242    -1       $(document.body).trigger("sticky_kit:recalc")
  243    -1     });
  244    -1 
   -1   246     $(document.body)
   -1   247       .on("click", ".recalc", function() {
   -1   248         console.log("Triggering recalc");
   -1   249         $(document.body).trigger("sticky_kit:recalc")
   -1   250       })
   -1   251       .on("click", ".detach", function() {
   -1   252         console.log("Triggering detach");
   -1   253         $(".container .item").trigger("sticky_kit:detach");
   -1   254       })
   -1   255       .on("click", ".attach", function() {
   -1   256         console.log("Triggering attach");
   -1   257         attach();
   -1   258       });
  245   259 
  246   260     $(document.body).on("click", ".grow_element", function(e) {
  247   261       var elm = $($(e.currentTarget).data("target"));