From 0c832c1b8d340d2add65617998bec25afe077f8e Mon Sep 17 00:00:00 2001 From: balasan Date: Mon, 7 Jul 2014 00:55:57 -0400 Subject: [PATCH 1/2] add offset_bottom support, test and small fixes --- .DS_Store | Bin 0 -> 6148 bytes Makefile | 2 +- jquery.sticky-kit.coffee | 22 +++++-- jquery.sticky-kit.js | 22 ++++--- jquery.sticky-kit.min.js | 8 --- test/offset_bottom.html | 122 +++++++++++++++++++++++++++++++++++++++ 6 files changed, 154 insertions(+), 22 deletions(-) create mode 100644 .DS_Store create mode 100644 test/offset_bottom.html diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6 GIT binary patch literal 6148 zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3 zem<@ulZcFPQ@L2!n>{z**++&mCkOWA81W14cNZlEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ zLs35+`xjp>T0 $@ + closure-compile --language_in=ECMASCRIPT5 $< > $@ jquery.sticky-kit.js: jquery.sticky-kit.coffee coffee -c $< diff --git a/jquery.sticky-kit.coffee b/jquery.sticky-kit.coffee index 5524706..1b22554 100644 --- a/jquery.sticky-kit.coffee +++ b/jquery.sticky-kit.coffee @@ -6,8 +6,10 @@ $ = @jQuery win = $ window $.fn.stick_in_parent = (opts={}) -> - { sticky_class, inner_scrolling, parent: parent_selector, offset_top } = opts + # add offset_bottom option + { sticky_class, inner_scrolling, parent: parent_selector, offset_top, offset_bottom } = opts offset_top ?= 0 + offset_bottom ?= 0 parent_selector ?= undefined inner_scrolling ?= true sticky_class ?= "is_stuck" @@ -24,7 +26,8 @@ $.fn.stick_in_parent = (opts={}) -> fixed = false bottomed = false spacer = $("
") - spacer.css('position', elm.css('position')) + # this breaks test two.html needed for something else? + # spacer.css('position', elm.css('position')) recalc = -> border_top = parseInt parent.css("border-top-width"), 10 @@ -70,6 +73,10 @@ $.fn.stick_in_parent = (opts={}) -> tick = -> scroll = win.scrollTop() + win_height = win.height() + # add check for over-scroll as in chrome + if (scroll + win_height > $('body').height()) + scroll = $('body').height()-win_height if last_pos? delta = scroll - last_pos last_pos = scroll @@ -104,11 +111,16 @@ $.fn.stick_in_parent = (opts={}) -> # updated offset if inner_scrolling - win_height = win.height() - if height > win_height # bigger than viewport + + # defined earlier + # win_height = win.height() + + # account for offset_bottom and offset_top + if height + offset_bottom + offset_top > win_height # bigger than viewport unless bottomed offset -= delta - offset = Math.max win_height - height, offset + # add offset_bottom + offset = Math.max win_height - height - offset_bottom, offset offset = Math.min offset_top, offset if fixed diff --git a/jquery.sticky-kit.js b/jquery.sticky-kit.js index 6dd08bf..f31c8e9 100644 --- a/jquery.sticky-kit.js +++ b/jquery.sticky-kit.js @@ -1,8 +1,9 @@ -// Generated by CoffeeScript 1.7.1 +// Generated by CoffeeScript 1.3.3 /** @license Sticky-kit v1.0.4 | WTFPL | Leaf Corcoran 2014 | http://leafo.net - */ +*/ + (function() { var $, win; @@ -12,14 +13,17 @@ win = $(window); $.fn.stick_in_parent = function(opts) { - var elm, inner_scrolling, offset_top, parent_selector, sticky_class, _fn, _i, _len; + var elm, inner_scrolling, offset_bottom, offset_top, parent_selector, sticky_class, _fn, _i, _len; if (opts == null) { opts = {}; } - sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, parent_selector = opts.parent, offset_top = opts.offset_top; + sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, parent_selector = opts.parent, offset_top = opts.offset_top, offset_bottom = opts.offset_bottom; if (offset_top == null) { offset_top = 0; } + if (offset_bottom == null) { + offset_bottom = 0; + } if (parent_selector == null) { parent_selector = void 0; } @@ -45,7 +49,6 @@ fixed = false; bottomed = false; spacer = $("
"); - spacer.css('position', elm.css('position')); recalc = function() { var border_top, padding_top, restore; border_top = parseInt(parent.css("border-top-width"), 10); @@ -82,6 +85,10 @@ tick = function() { var css, delta, scroll, will_bottom, win_height; scroll = win.scrollTop(); + win_height = win.height(); + if (scroll + win_height > $('body').height()) { + scroll = $('body').height() - win_height; + } if (last_pos != null) { delta = scroll - last_pos; } @@ -111,11 +118,10 @@ elm.css(css).removeClass(sticky_class).trigger("sticky_kit:unstick"); } if (inner_scrolling) { - win_height = win.height(); - if (height > win_height) { + if (height + offset_bottom + offset_top > win_height) { if (!bottomed) { offset -= delta; - offset = Math.max(win_height - height, offset); + offset = Math.max(win_height - height - offset_bottom, offset); offset = Math.min(offset_top, offset); if (fixed) { elm.css({ diff --git a/jquery.sticky-kit.min.js b/jquery.sticky-kit.min.js index c3fcc0c..e69de29 100644 --- a/jquery.sticky-kit.min.js +++ b/jquery.sticky-kit.min.js @@ -1,8 +0,0 @@ -/* - Sticky-kit v1.0.4 | WTFPL | Leaf Corcoran 2014 | http://leafo.net -*/ -(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("
");g.css("position",a.css("position"));A=function(){var c, -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= -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")),sb&&!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")? -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:"", -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 + + + + + + + + + +
+ hello + + +
+ +
+
+ The Header +
+ +
+
Hello world
+
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
Piss World
+
+
+ +
+ + + + From 3f09fdc5e76b2f2b046cf75b137d2347a213c8db Mon Sep 17 00:00:00 2001 From: balasan Date: Mon, 7 Jul 2014 01:06:40 -0400 Subject: [PATCH 2/2] add offset_bottom support, test and small fixes --- Makefile | 2 +- jquery.sticky-kit.min.js | 8 ++++++++ 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/Makefile b/Makefile index 92de487..913eab5 100644 --- a/Makefile +++ b/Makefile @@ -1,6 +1,6 @@ jquery.sticky-kit.min.js: jquery.sticky-kit.js - closure-compile --language_in=ECMASCRIPT5 $< > $@ + closure-compiler --language_in=ECMASCRIPT5 $< > $@ jquery.sticky-kit.js: jquery.sticky-kit.coffee coffee -c $< diff --git a/jquery.sticky-kit.min.js b/jquery.sticky-kit.min.js index e69de29..1151f60 100644 --- a/jquery.sticky-kit.min.js +++ b/jquery.sticky-kit.min.js @@ -0,0 +1,8 @@ +/* + Sticky-kit v1.0.4 | WTFPL | Leaf Corcoran 2014 | http://leafo.net +*/ +(function(){var d,p;d=this.jQuery;p=d(window);d.fn.stick_in_parent=function(e){var x,u,l,m,q,E,n,F;null==e&&(e={});q=e.sticky_class;x=e.inner_scrolling;m=e.parent;l=e.offset_top;u=e.offset_bottom;null==l&&(l=0);null==u&&(u=0);null==m&&(m=void 0);null==x&&(x=!0);null==q&&(q="is_stuck");E=function(a,e,n,y,B,r,t){var s,C,h,z,b,f,D,A,g,c;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);f=a.parent();null!=m&&(f=f.closest(m));if(!f.length)throw"failed to find stick parent";s=h=!1;g=d("
");D=function(){var b, +d;b=parseInt(f.css("border-top-width"),10);d=parseInt(f.css("padding-top"),10);e=parseInt(f.css("padding-bottom"),10);n=f.offset().top+b+d;y=f.height();b=h?(h=!1,s=!1,a.insertAfter(g).css({position:"",top:"",width:"",bottom:""}).removeClass(q),g.detach(),!0):void 0;B=a.offset().top-parseInt(a.css("margin-top"),10)-l;r=a.outerHeight(!0);t=a.css("float");g.css({width:a.outerWidth(!0),height:r,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":t});if(b)return c()};D();if(r!==y)return z= +void 0,b=l,c=function(){var c,m,k,v,w;k=p.scrollTop();w=p.height();k+w>d("body").height()&&(k=d("body").height()-w);null!=z&&(m=k-z);z=k;h?(v=k+r+b>y+n,s&&!v&&(s=!1,a.css({position:"fixed",bottom:"",top:b}).trigger("sticky_kit:unbottom")),kw&&!s&&(b-=m,b=Math.max(w-r-u,b),b=Math.min(l,b),h&&a.css({top:b+"px"}))):k>B&&(h=!0,c={position:"fixed", +top:b},c.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(c).addClass(q).after(g),"left"!==t&&"right"!==t||g.append(a),a.trigger("sticky_kit:stick"));if(h&&(null==v&&(v=k+r+b>y+n),!s&&v))return s=!0,"static"===f.css("position")&&f.css({position:"relative"}),a.css({position:"absolute",bottom:e,top:"auto"}).trigger("sticky_kit:bottom")},A=function(){D();return c()},C=function(){p.off("scroll",c);d(document.body).off("sticky_kit:recalc",A);a.off("sticky_kit:detach",C); +a.removeData("sticky_kit");a.css({position:"",bottom:"",top:""});f.position("position","");if(h)return a.insertAfter(g).removeClass(q),g.remove()},p.on("touchmove",c),p.on("scroll",c),p.on("resize",A),d(document.body).on("sticky_kit:recalc",A),a.on("sticky_kit:detach",C),setTimeout(c,0)}};n=0;for(F=this.length;n