garand / sticky

jQuery Plugin for Sticky Objects
Other
3.3k stars 1.06k forks source link

Produced Dirty Html #161

Open ghost opened 9 years ago

ghost commented 9 years ago

After some stick and unstick events, this is produced html. Goes too deep, too many div inside itself.
Is this a bug? Funny question. screen shot 2015-06-17 at 22 40 31

microcipcip commented 9 years ago

You need to share the code, are you disabling the correct element?

ghost commented 9 years ago

Resize window a couple of times. If windows.width is small i unstick it. If wider again. sticky again. This is developer issue. Normal user don't do this and don't cause my app to broke.

var maxWidth = Math.max($(window).width(), window.innerWidth); $(window).resize(function () { restoreSticky(); maxWidth = Math.max($(window).width(), window.innerWidth); });

function restoreSticky() { if (maxWidth > 991) { $('.navCont').css('height', ['90px']); $(".navCont").sticky(); } else { $(".navCont").unstick(); $('.navCont').css('height', ['100%']); } }

Tardis1234 commented 8 years ago

I had the same issue for what it's worth. As @atilkan said, it occurs on window resize.

microcipcip commented 8 years ago

I have found a very easy fix. I just need to call unstick BEFORE I call stick.

var $el = $('.element');
window.onresize = function() { 
  if ($(window).width() >= 768) {
      $el.unstick();
      $el.sticky({topSpacing: 0, bottomSpacing: 0});
  } else {
      $el.unstick();
  }
};

Tips: use Underscore Debounce to increase performance: http://underscorejs.org/#debounce