Question

I have the following jQuery which basically leaves the div at it’s normal CSS positioning (relative) until a certain offset (in this case 60px) is reached. At that point the CSS gets changed to position: fixed.

<script>
$(function () { 
  var $el = $('.sticky'), 
      originalTop = $el.offset(60).top;  // store original top position

  $(window).scroll(function(e){ 
    if ($(this).scrollTop() > originalTop ){ 
      $el.css({'position': 'fixed', 'top': '10px'}); 
    } else { 
      $el.css({'position': 'absolute', 'top': originalTop}); 
    } 
  }); 
});
</script>

What’s blowing my mind is that the above code was working in 1.3.2 and after pulling my hair out trying to plug this code into a new project, I’ve found that downgrading from 1.6.2 to jQuery v1.3.2 causes it to work as expected.

Can someone tell me how to update my jQuery code to be compatible with jQuery 1.6.2?

Answer 1

Change this:

originalTop = $el.offset(60).top;

To this:

originalTop = $el.offset().top;

offset(val) now sets the offset^Doc (as of version 1.4).   And, 60 is not a proper coordinate value.