Jquery Create A Scroll Follow Div

ok I have seen people using position:fixed to have a div follow the scroll. I have also seen the following solution which is good ( Jquery follow scroll ) but I was wondering how

Solution 1:

As a slight alternative to Adam Hutchinson's

http://jsfiddle.net/HelloJoe/JjuQu/

It's pretty self explanatory but just say if you need anything explained.

Solution 2:

This div in the example is not polsition:fixed, or absolute. What they do is to animate the margint-top attribute on scroll relatively

Solution 3:

Looks like you need to map an event to the document scrolling and then move a div relative to the scroll. Something along these lines may give you somewhere to start.

$(document).scroll(function(){
    $('#divtomove').css('top', $(document).scrollTop());
})

Solution 4:

Also, this is the code in the example page, just to get an idea

var $scrollingDiv = $("#customize");
    $(window).scroll(function () {
        if ($(window).scrollTop() > 490) {
            if (($("#maincontentbox").height() - $(window).scrollTop()) > 0) {
                $scrollingDiv.stop().animate({
                    "marginTop": ($(window).scrollTop() - 500) + "px"
                }, "slow");
            }
        } else {
            $scrollingDiv.stop().animate({
                "marginTop": "0px"
            }, "slow");
        }
    });

Solution 5:

Simpler solution:

$('#divtomove').scrollFollow();