#2366, fixes when sticky content is larger than context height. Fixes margin bottom not clearing when pushing: true

src/definitions/modules/sticky.js

@@ -239,6 +239,9 @@ $.fn.sticky = function(parameters) {
                 offset        : $context.offset(),
                 height        : $context.outerHeight(),
                 bottomPadding : parseInt($context.css('padding-bottom'), 10)
+              },
+              container = {
+                height: $container.outerHeight()
               }
             ;
             module.cache = {
@@ -333,7 +336,9 @@ $.fn.sticky = function(parameters) {
         set: {
           offset: function() {
             module.verbose('Setting offset on element', settings.offset);
-            $module.css('margin-top', settings.offset);
+            $module
+              .css('margin-top', settings.offset)
+            ;
           },
           containerSize: function() {
             var
@@ -345,7 +350,8 @@ $.fn.sticky = function(parameters) {
               module.determineContainer();
             }
             else {
-              if( Math.abs($container.height() - module.cache.context.height) > 5) {
+              console.log($container.outerHeight(), module.cache.context.height, $module);
+              if( Math.abs($container.outerHeight() - module.cache.context.height) > settings.jitter) {
                 module.debug('Context has padding, specifying exact height for container', module.cache.context.height);
                 $container.css({
                   height: module.cache.context.height
@@ -353,6 +359,14 @@ $.fn.sticky = function(parameters) {
               }
             }
           },
+          minimumSize: function() {
+            var
+              element   = module.cache.element
+            ;
+            $container
+              .css('min-height', element.height)
+            ;
+          },
           scroll: function(scroll) {
             module.debug('Setting scroll on element', scroll);
             if(module.elementScroll == scroll) {
@@ -432,11 +446,11 @@ $.fn.sticky = function(parameters) {
           if(elementVisible) {
 
             if( module.is.initialPosition() ) {
-              if(scroll.top >= context.bottom) {
+              if(scroll.top > context.bottom) {
                 module.debug('Element bottom of container');
                 module.bindBottom();
               }
-              else if(scroll.top >= element.top) {
+              else if(scroll.top > element.top) {
                 module.debug('Element passed, fixing element to page');
                 module.fixTop();
               }
@@ -504,9 +518,11 @@ $.fn.sticky = function(parameters) {
           module.debug('Binding element to top of parent container');
           module.remove.offset();
           $module
-            .css('left' , '')
-            .css('top' , '')
-            .css('margin-bottom' , '')
+            .css({
+              left         : '',
+              top          : '',
+              marginBottom : ''
+            })
             .removeClass(className.fixed)
             .removeClass(className.bottom)
             .addClass(className.bound)
@@ -519,9 +535,11 @@ $.fn.sticky = function(parameters) {
           module.debug('Binding element to bottom of parent container');
           module.remove.offset();
           $module
-            .css('left' , '')
-            .css('top' , '')
-            .css('margin-bottom' , module.cache.context.bottomPadding)
+            .css({
+              left         : '',
+              top          : '',
+              marginBottom : module.cache.context.bottomPadding
+            })
             .removeClass(className.fixed)
             .removeClass(className.top)
             .addClass(className.bound)
@@ -539,10 +557,14 @@ $.fn.sticky = function(parameters) {
 
         fixTop: function() {
           module.debug('Fixing element to top of page');
+          module.set.minimumSize();
           module.set.offset();
           $module
-            .css('left', module.cache.element.left)
-            .css('bottom' , '')
+            .css({
+              left         : module.cache.element.left,
+              bottom       : '',
+              marginBottom : ''
+            })
             .removeClass(className.bound)
             .removeClass(className.bottom)
             .addClass(className.fixed)
@@ -553,10 +575,14 @@ $.fn.sticky = function(parameters) {
 
         fixBottom: function() {
           module.debug('Sticking element to bottom of page');
+          module.set.minimumSize();
           module.set.offset();
           $module
-            .css('left', module.cache.element.left)
-            .css('bottom' , '')
+            .css({
+              left         : module.cache.element.left,
+              bottom       : '',
+              marginBottom : ''
+            })
             .removeClass(className.bound)
             .removeClass(className.top)
             .addClass(className.fixed)
@@ -792,20 +818,41 @@ $.fn.sticky.settings = {
   verbose        : true,
   performance    : true,
 
+  // whether to stick in the opposite direction on scroll up
   pushing        : false,
+
   context        : false,
+
+  // Context to watch scroll events
   scrollContext  : window,
 
+  // Offset to adjust scroll
   offset         : 0,
+
+  // Offset to adjust scroll when attached to bottom of screen
   bottomOffset   : 0,
 
+  jitter         : 5, // will only set container height if difference between context and container is larger than this number
+
+  // Whether to automatically observe changes with Mutation Observers
   observeChanges : false,
 
+  // Called when position is recalculated
   onReposition   : function(){},
+
+  // Called on each scroll
   onScroll       : function(){},
+
+  // Called when element is stuck to viewport
   onStick        : function(){},
+
+  // Called when element is unstuck from viewport
   onUnstick      : function(){},
+
+  // Called when element reaches top of context
   onTop          : function(){},
+
+  // Called when element reaches bottom of context
   onBottom       : function(){},
 
   error         : {