Question

Is it a good idea to store these values as variables (outside of .scroll() ) in the following example?

$(window).scroll(function(){
  if ( $(document).height() <= ( $(window).height() + $(window).scrollTop() ) ) {
    // position stuff
  } else {
    // other position stuff
  }
});

The only downside to this I see is that the heights should be checked again in case of a window resize. Or do I only need to store the objects themselves?

Any feedback is greatly appreciated!

Answer 1

At the very least, it’s definitely a good idea to store references to $(document) and $(window) outside of the scroll callback, since the scroll event might be fired repeatedly and rapidly.

var $win = $(window),
    $doc = $(document);

$win.scroll(function(){
  if ( $doc.height() <= ( $win.height() + $win.scrollTop() ) ) {
    // position stuff
  } else {
    // other position stuff
  }
});

It shouldn’t hurt to do as you ask, and store the document and window heights outside of the callback as well — provided that you update them as needed. A nice way to handle all of this is to use the excellent jQuery throttle/debounce plugin, which gives you a simple interface for making sure a function doesn’t run too frequently.