Stopping floating menu at base of page

[Jake Carter]

Hi Everyone,
I have implemented a floating menu that scrolls with the page. I am looking for help trying to "stop" the scrolling when it reaches the end of the content. Currently, if you scroll to the bottom of the page it overlaps onto the footer. Here is the site: www.getmyrank.com

I've also attached a screen shot to try and help illustrate what i'm trying to do. Any suggestions?

[Rabbit]

You'll have to use the scroll event to figure out how far down they are on the page. When they get to a position where the menu will overlap the footer, change the positioning from fixed to absolute and position it at the bottom. When they scroll up enough, reverse the changes.

Here's a reference on the scroll event and how to find out how far they've scrolled.
http://help.dottoro.com/ljurkcpe.php

[Jake Carter]

Thanks for the reference. Might be outside of my abilities im worried :/

is there a way to do it with CSS and creating a new DIV?

[Rabbit]

I don't think it's possible with just css. Maybe if the main content is in an iframe it might be possible. But there are issues with iframes as well.

If you want to give the javascript a shot, you can post any problems you run into and we can help you work through them.