javascript floating menu bar in holding div

I have a JavaScript menu bar that is positioned on my webpage, then when the browser bar reaches the top of the menu it locks into a fixed position and moves with the window. However, i need to contain the menu within a div, how can this be done?

This is my menu bar:

<script type="text/javascript"     src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).load(function(){
    $(window).scroll(function(){
        if ($(window).scrollTop() >= 200)
        {
            $("#floatbar").css({position:'fixed',left:'0',top:'0'});
        }
        else开发者_JAVA技巧
        {
            $("#floatbar").css({position:'absolute',left:'0',top:'200px'});
        }
    });
});
</script>

and this is my html:

<div id="menu_runner">
    <div id="floatbar">
        <a href="#issue49">Issue 49</a><br />
        <a href="#issue48">Issue 48</a><br />
        <a href="#issue47">Issue 47</a><br />
        <a href="#issue46">Issue 46</a><br />
    </div>
</div>

and my css:

#menu_runner {
    width: 100px;
    height: 2000px;
    float: right;
    position: relative;
}
#floatbar {
    width: 70px;
    position: absolute;
    top: 200px;
}

where the menu runner is the containing div of the menu, and the floatbar obviously contains the menu which runs the JavaScript.

However when I try this code, the menu sticks to the left and 200px from the top, and not within the menu_runner div. How can i make the floatbar be positioned in the menu_runner div and then scroll down with the JavaScript within the div as it should.

if ($(window).scrollTop() >= 0) <------set it to zero or you could use css

#floatbar {
     position:fixed;
     top: 10px;  /* tells browser the div should position at the very bottom of the window */
     right: 1px;  /* tells the browser the div should have no space on the right */
     left: 1px;  /* tells the browser the div should have no space on the left */
     margin: 1px; /* because we want this width: 100%, the margin must be 0 */
     padding: 1px; /* because we want the width: 100%, the padding must be 0 */
     width: 10px; /* makes the div a bar stretching across the bottom of the screen */
     height: 35px; /* makes the floating bar 35 pixels high*/
     z-index: 9999; /*positions this div on top of all other elements in the site - this number can increase or decrease to your liking */
     border:1px solid #000;
}