Sticky after scroll certain amount from top

[Giovanni-Mattucci]

Is it possible to have sticky kick in after the element is say, 50px past the top (or bottom)? This would all an element to stay in position until you are almost covering it all, THEN fix the element to the page with a nice transition.

Any thoughts on how to achieve this and if the plugin can do this already? Adding something like:

$('.header').sticky({
     stickAfter: 50
});

would be a nice addition to the plugin.

[coffeeneed]

I also really need this. Anyone got a fix for it, please? :)

[coffeeneed]

@Giovanni-Mattucci Did you find a fix for this?

I tried this, and it works the first time, but Sticky won't destroy/reset when I scroll to the top again.

Any status on this? I need a destroy method to reset StickyJS when the user scroll to the top again. My code is as follows to allow for a threshold so that it won't sticky at once:

$(window).scroll(function() {
  if ($(this).scrollTop() > 200){  
      $("#top-site-inner").sticky({
        topSpacing:0,
        zIndex:100000,
      });
  }
});

EDIT: I fixed this by using the unstick() method. Here's my code:

$(window).scroll(function() {
  if ($(this).scrollTop() > 200){  
      $("#top-site-inner").sticky({
        topSpacing:0,
        zIndex:100000,
      });
  }
  else{
     $("#top-site-inner").unstick();
  }
});

Hope it works.

[Giovanni-Mattucci]

@coffeeneed cool solution!

In the end I cloned the navigation using JS and then had it transition after scrolling past a certain point.

This is what I based my code on, although I made a far simpler version: http://stackoverflow.com/questions/18382496/sticky-header-after-scrolling-down