Navigation menu following page scroll creating a problem

JavaScript
1

Hi there, I would like some suggestions on how to improve a simple javascript code on my web site.

The left navigation menu slides down as you scroll the page. It works perfect on the computer I’m using now with IE8, Google Chrome and Firefox on Windows 7.

However when I try it on any other computer with IE8 or another browser, when you reach the bottom of the page the menu continues to scroll thereby creating white space.

Please try it out and let me know if it does the same thing on your browser and what you are using.

If someone can help offer suggestions on how to improve the code, that would be great!

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type="text/javascript">
        $(function() {
            var offset = $("#sidebar").offset();
            var topPadding = 15;
            $(window).scroll(function() {
                if ($(window).scrollTop() > offset.top) {
                    $("#sidebar").stop().animate({
                        marginTop: $(window).scrollTop() - offset.top + topPadding
                    });
                } else {
                    $("#sidebar").stop().animate({
                        marginTop: 0
                    });
                };
            });
        });
 </script>

<div id="sidebar">left menu content goes here</div>

Thanks for your help!

2

Bump. Just in case anyone doesn’t know what I’m referring to. Please check out the menu on the left at www.vancouverprofile.com. It scrolls with you down the page, however it creates white space at the bottom of the page on any other browser, except my own computer.

Any suggestions or tips to fix the code would be greatly appreciated.

Thanks!