I need to have a div that is positioned in the middle of the screen on page load, and that scrolls with the rest of the screen, change to a fixed position when it hits the top of the screen. I found a solution for this written in jquery, but I need it in mootools. Can anyone help me with this?
function sticky_relocate() {
var window_top = $(window).scrollTop();
var div_top = $('#right-column').offset().top;
if (window_top > div_top)
$('#contact').addClass('fixed')
else
$('#contact').removeClass('fixed');
}
$(function() {
$(window).scroll(sticky_relocate);
sticky_relocate();
});
function sticky_relocate() {
var window_top = $(window).getScroll().y;
var div_top = $('right-column').getPosition().y;
if (window_top > div_top)
$('contact').addClass('fixed')
else
$('contact').removeClass('fixed');
}
$(window).addEvent('scroll', function(){
sticky_relocate();
});
sticky_relocate();