JavaScript中的浮動菜單欄在舉行div

Question

我有一個JavaScript菜單欄位於我的網頁上，然後當瀏覽器欄到達菜單的頂部時，它鎖定到一個固定的位置，並與窗口一起移動。但是，我需要在div中包含菜單，這怎麼辦？

這是我的菜單欄：

<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 
     { 
      $("#floatbar").css({position:'absolute',left:'0',top:'200px'}); 
     } 
    }); 
}); 
</script> 

，這是我的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> 

和我的CSS：

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

在菜單亞軍是包含div菜單和floatbar顯然包含運行JavaScript的菜單。

但是，當我嘗試此代碼時，菜單將粘貼到左側和頂部200px，而不是在menu_runner div內。我該如何讓floatbar定位在menu_runner div中，然後使用div內的JavaScript向下滾動。

Answer 1

爲什麼不將$("#floatbar").css()更改爲$("#menu_runner").css()？