simple jQuery smooth scrolling block

Sometimes you want a block to scroll along when the user scrolls, but you don't want it to show up everywhere and to stop at certain points.
This is where you can use this simple jQuery scroll along script.

jQuery(document).ready(function() {
  var $scrollingDiv = jQuery("#SELECTOR");
                var $topStop = 300;//place here the height of your header
                var $bottomStop = 2600;// place here where your footer starts
  jQuery(window).scroll(function(){   
                         var top = jQuery(window).scrollTop();
                          if(top > $topStop && top < $bottomStop)
                                {
                 $scrollingDiv
    .stop()
    .animate({"marginTop": (top - $topStop) + "px"}, "slow" );   
                                }
                         else
                                {
                                if(top < $topStop)
                                     {
                                     $scrollingDiv
             .stop()
             .animate({"marginTop": "0px"}, "slow" );   
                                     }
                                }
  });
 });

Just put the jQuery selector in #SELECTOR, the ID of class of your div/element that needs to scroll along, and it wil simply scroll along, untill it reaches $bottom stop.

$topStop is usually the height of your header. Normally you don't want it to scroll unless the user gets below the header, then you want it to scroll along.

$bottomStop is where you define where you want it to stop scrolling along so it doesn't push your footer down.
Example

a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
a
h
. mah... comic should stop around here...
.
.
.
d
r
o
p
p
e
d

m
y

c
o
o
k
i
e
!
!
!