relatively-sticky

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

commit
101b16030067fdc8b8c2c45bc27391b7e898a994
parent
11d0ac65a4102ce06069124b0206be0c1af08783
Author
leaf corcoran <leafot@gmail.com>
Date
2014-11-13 18:26
version bump :v:

Diffstat

M bower.json 2 +-
M jquery.sticky-kit.coffee 2 +-
M jquery.sticky-kit.js 2 +-
M jquery.sticky-kit.min.js 2 +-
M site/index.html 4 ++++
M site/site.moon 2 +-
M site/www/src/jquery.sticky-kit.js 112 +++++++++++++++++++++++++++++++++++++++++--------------------
M site/www/src/jquery.sticky-kit.min.js 13 +++++++------
M sticky-kit.jquery.json 2 +-

9 files changed, 92 insertions, 49 deletions


diff --git a/bower.json b/bower.json

@@ -1,6 +1,6 @@
    1     1 {
    2     2   "name": "sticky-kit",
    3    -1   "version": "1.0.4",
   -1     3   "version": "1.1.0",
    4     4   "homepage": "http://leafo.net/sticky-kit/",
    5     5   "authors": [
    6     6     "leaf corcoran <leafot@gmail.com>"

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

@@ -1,5 +1,5 @@
    1     1 ###*
    2    -1 @license Sticky-kit v1.0.5 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
   -1     2 @license Sticky-kit v1.1.0 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    3     3 ###
    4     4 
    5     5 $ = @jQuery or window.jQuery

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

@@ -1,7 +1,7 @@
    1     1 // Generated by CoffeeScript 1.7.1
    2     2 
    3     3 /**
    4    -1 @license Sticky-kit v1.0.5 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
   -1     4 @license Sticky-kit v1.1.0 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    5     5  */
    6     6 
    7     7 (function() {

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

@@ -1,5 +1,5 @@
    1     1 /*
    2    -1  Sticky-kit v1.0.5 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
   -1     2  Sticky-kit v1.1.0 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    3     3 */
    4     4 (function(){var k,e;k=this.jQuery||window.jQuery;e=k(window);k.fn.stick_in_parent=function(d){var w,y,n,r,h,C,s,F,p,G;null==d&&(d={});s=d.sticky_class;y=d.inner_scrolling;C=d.recalc_every;h=d.parent;r=d.offset_top;n=d.spacer;w=d.bottoming;null==r&&(r=0);null==h&&(h=void 0);null==y&&(y=!0);null==s&&(s="is_stuck");null==w&&(w=!0);F=function(a,d,p,z,D,t,q){var u,E,m,A,c,f,B,x,v,g,b;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);f=a.parent();null!=h&&(f=f.closest(h));if(!f.length)throw"failed to find stick parent";
    5     5 u=m=!1;(g=null!=n?n&&a.closest(n):k("<div />"))&&g.css("position",a.css("position"));B=function(){var c,e,l;c=parseInt(f.css("border-top-width"),10);e=parseInt(f.css("padding-top"),10);d=parseInt(f.css("padding-bottom"),10);p=f.offset().top+c+e;z=f.height();m&&(u=m=!1,null==n&&(a.insertAfter(g),g.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(s),l=!0);D=a.offset().top-parseInt(a.css("margin-top"),10)-r;t=a.outerHeight(!0);q=a.css("float");g&&g.css({width:a.outerWidth(!0),height:t,

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

@@ -273,6 +273,10 @@ Note: only floated columns work in IE7.
  273   273 </h1>
  274   274 
  275   275 $markdown{[[
   -1   276   * **v1.1.0** - *Nov 13, 2014* --  Add `recalc_every`, `bottoming`, and
   -1   277   `spacer` options. Fix bug where some events weren't getting removed on
   -1   278   detach. Fixed bug where sticky class was not removed on detach (poziworld),
   -1   279   pull `jQuery` from `window` if it can't be found on `this` (Connor Peet)
  276   280   * **v1.0.4** - *Mar 29, 2014* -- `touchmove` events for mobile (Alfredo
  277   281   Motta), support absolutely positioned element (Pierre Spring), `border-box`
  278   282   element sets spacer correctly (jasonpolito), bug fix for bottomed state (Pierre

diff --git a/site/site.moon b/site/site.moon

@@ -9,7 +9,7 @@ exec = (cmd) ->
    9     9 
   10    10 site = sitegen.create_site =>
   11    11   @title = "Sticky-Kit | jQuery plugin for sticky elements"
   12    -1   @version = "1.0.4"
   -1    12   @version = "1.1.0"
   13    13 
   14    14   @full_size = exec("du -bh www/src/jquery.sticky-kit.js | cut -f 1")\lower!
   15    15   @compressed_size = exec("du -bh www/src/jquery.sticky-kit.min.js | cut -f 1")\lower!

diff --git a/site/www/src/jquery.sticky-kit.js b/site/www/src/jquery.sticky-kit.js

@@ -1,22 +1,22 @@
    1     1 // Generated by CoffeeScript 1.7.1
    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() {
    8     8   var $, win;
    9     9 
   10    -1   $ = this.jQuery;
   -1    10   $ = this.jQuery || window.jQuery;
   11    11 
   12    12   win = $(window);
   13    13 
   14    14   $.fn.stick_in_parent = function(opts) {
   15    -1     var elm, inner_scrolling, offset_top, parent_selector, sticky_class, _fn, _i, _len;
   -1    15     var elm, enable_bottoming, inner_scrolling, manual_spacer, offset_top, parent_selector, recalc_every, sticky_class, _fn, _i, _len;
   16    16     if (opts == null) {
   17    17       opts = {};
   18    18     }
   19    -1     sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, parent_selector = opts.parent, offset_top = opts.offset_top;
   -1    19     sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, recalc_every = opts.recalc_every, parent_selector = opts.parent, offset_top = opts.offset_top, manual_spacer = opts.spacer, enable_bottoming = opts.bottoming;
   20    20     if (offset_top == null) {
   21    21       offset_top = 0;
   22    22     }
@@ -29,8 +29,11 @@
   29    29     if (sticky_class == null) {
   30    30       sticky_class = "is_stuck";
   31    31     }
   -1    32     if (enable_bottoming == null) {
   -1    33       enable_bottoming = true;
   -1    34     }
   32    35     _fn = function(elm, padding_bottom, parent_top, parent_height, top, height, el_float) {
   33    -1       var bottomed, detach, fixed, last_pos, offset, parent, recalc, recalc_and_tick, spacer, tick;
   -1    36       var bottomed, detach, fixed, last_pos, offset, parent, recalc, recalc_and_tick, recalc_counter, spacer, tick;
   34    37       if (elm.data("sticky_kit")) {
   35    38         return;
   36    39       }
@@ -44,8 +47,10 @@
   44    47       }
   45    48       fixed = false;
   46    49       bottomed = false;
   47    -1       spacer = $("<div />");
   48    -1       spacer.css('position', elm.css('position'));
   -1    50       spacer = manual_spacer != null ? manual_spacer && elm.closest(manual_spacer) : $("<div />");
   -1    51       if (spacer) {
   -1    52         spacer.css('position', elm.css('position'));
   -1    53       }
   49    54       recalc = function() {
   50    55         var border_top, padding_top, restore;
   51    56         border_top = parseInt(parent.css("border-top-width"), 10);
@@ -53,22 +58,33 @@
   53    58         padding_bottom = parseInt(parent.css("padding-bottom"), 10);
   54    59         parent_top = parent.offset().top + border_top + padding_top;
   55    60         parent_height = parent.height();
   56    -1         restore = fixed ? (fixed = false, bottomed = false, elm.insertAfter(spacer).css({
   57    -1           position: "",
   58    -1           top: "",
   59    -1           width: "",
   60    -1           bottom: ""
   61    -1         }).removeClass(sticky_class), spacer.detach(), true) : void 0;
   -1    61         if (fixed) {
   -1    62           fixed = false;
   -1    63           bottomed = false;
   -1    64           if (manual_spacer == null) {
   -1    65             elm.insertAfter(spacer);
   -1    66             spacer.detach();
   -1    67           }
   -1    68           elm.css({
   -1    69             position: "",
   -1    70             top: "",
   -1    71             width: "",
   -1    72             bottom: ""
   -1    73           }).removeClass(sticky_class);
   -1    74           restore = true;
   -1    75         }
   62    76         top = elm.offset().top - parseInt(elm.css("margin-top"), 10) - offset_top;
   63    77         height = elm.outerHeight(true);
   64    78         el_float = elm.css("float");
   65    -1         spacer.css({
   66    -1           width: elm.outerWidth(true),
   67    -1           height: height,
   68    -1           display: elm.css("display"),
   69    -1           "vertical-align": elm.css("vertical-align"),
   70    -1           "float": el_float
   71    -1         });
   -1    79         if (spacer) {
   -1    80           spacer.css({
   -1    81             width: elm.outerWidth(true),
   -1    82             height: height,
   -1    83             display: elm.css("display"),
   -1    84             "vertical-align": elm.css("vertical-align"),
   -1    85             "float": el_float
   -1    86           });
   -1    87         }
   72    88         if (restore) {
   73    89           return tick();
   74    90         }
@@ -79,30 +95,42 @@
   79    95       }
   80    96       last_pos = void 0;
   81    97       offset = offset_top;
   -1    98       recalc_counter = recalc_every;
   82    99       tick = function() {
   83   100         var css, delta, scroll, will_bottom, win_height;
   -1   101         if (recalc_counter != null) {
   -1   102           recalc_counter -= 1;
   -1   103           if (recalc_counter <= 0) {
   -1   104             recalc_counter = recalc_every;
   -1   105             recalc();
   -1   106           }
   -1   107         }
   84   108         scroll = win.scrollTop();
   85   109         if (last_pos != null) {
   86   110           delta = scroll - last_pos;
   87   111         }
   88   112         last_pos = scroll;
   89   113         if (fixed) {
   90    -1           will_bottom = scroll + height + offset > parent_height + parent_top;
   91    -1           if (bottomed && !will_bottom) {
   92    -1             bottomed = false;
   93    -1             elm.css({
   94    -1               position: "fixed",
   95    -1               bottom: "",
   96    -1               top: offset
   97    -1             }).trigger("sticky_kit:unbottom");
   -1   114           if (enable_bottoming) {
   -1   115             will_bottom = scroll + height + offset > parent_height + parent_top;
   -1   116             if (bottomed && !will_bottom) {
   -1   117               bottomed = false;
   -1   118               elm.css({
   -1   119                 position: "fixed",
   -1   120                 bottom: "",
   -1   121                 top: offset
   -1   122               }).trigger("sticky_kit:unbottom");
   -1   123             }
   98   124           }
   99   125           if (scroll < top) {
  100   126             fixed = false;
  101   127             offset = offset_top;
  102    -1             if (el_float === "left" || el_float === "right") {
  103    -1               elm.insertAfter(spacer);
   -1   128             if (manual_spacer == null) {
   -1   129               if (el_float === "left" || el_float === "right") {
   -1   130                 elm.insertAfter(spacer);
   -1   131               }
   -1   132               spacer.detach();
  104   133             }
  105    -1             spacer.detach();
  106   134             css = {
  107   135               position: "",
  108   136               width: "",
@@ -133,14 +161,17 @@
  133   161               top: offset
  134   162             };
  135   163             css.width = elm.css("box-sizing") === "border-box" ? elm.outerWidth() + "px" : elm.width() + "px";
  136    -1             elm.css(css).addClass(sticky_class).after(spacer);
  137    -1             if (el_float === "left" || el_float === "right") {
  138    -1               spacer.append(elm);
   -1   164             elm.css(css).addClass(sticky_class);
   -1   165             if (manual_spacer == null) {
   -1   166               elm.after(spacer);
   -1   167               if (el_float === "left" || el_float === "right") {
   -1   168                 spacer.append(elm);
   -1   169               }
  139   170             }
  140   171             elm.trigger("sticky_kit:stick");
  141   172           }
  142   173         }
  143    -1         if (fixed) {
   -1   174         if (fixed && enable_bottoming) {
  144   175           if (will_bottom == null) {
  145   176             will_bottom = scroll + height + offset > parent_height + parent_top;
  146   177           }
@@ -164,7 +195,9 @@
  164   195         return tick();
  165   196       };
  166   197       detach = function() {
   -1   198         win.off("touchmove", tick);
  167   199         win.off("scroll", tick);
   -1   200         win.off("resize", recalc_and_tick);
  168   201         $(document.body).off("sticky_kit:recalc", recalc_and_tick);
  169   202         elm.off("sticky_kit:detach", detach);
  170   203         elm.removeData("sticky_kit");
@@ -175,8 +208,13 @@
  175   208         });
  176   209         parent.position("position", "");
  177   210         if (fixed) {
  178    -1           elm.insertAfter(spacer).removeClass(sticky_class);
  179    -1           return spacer.remove();
   -1   211           if (manual_spacer == null) {
   -1   212             if (el_float === "left" || el_float === "right") {
   -1   213               elm.insertAfter(spacer);
   -1   214             }
   -1   215             spacer.remove();
   -1   216           }
   -1   217           return elm.removeClass(sticky_class);
  180   218         }
  181   219       };
  182   220       win.on("touchmove", tick);

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

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

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

@@ -1,6 +1,6 @@
    1     1 {
    2     2   "name": "sticky-kit",
    3    -1   "version": "1.0.4",
   -1     3   "version": "1.1.0",
    4     4 
    5     5   "title": "Sticky-kit",
    6     6   "homepage": "http://leafo.net/sticky-kit",