title: Responsive scrolltop
body: <p>Im using the following code to detect when an object should become 'sticky' and stay fixed in its content.</p>
  
  <pre><code>var $window = $(window),
      $stickyEl = $('#single-post-details'),
      elTop = $stickyEl.offset().top;
  
  $window.scroll(function() {
      $stickyEl.toggleClass('sticky', $window.scrollTop() + 52 &gt; elTop);
  });
  </code></pre>
  
  <p>However I would like to make this responsive. This means that somehow it needs to detect the height of the banner above it first so that it doesn't trigger at the wrong point.. <a href="http://jsfiddle.net/en62c3kq/1/" rel="nofollow">Here is a fiddle with as an example.</a></p>