Jak zbudować prostą nawigację lepką na dole strony?

Próbuję to zrobić, więc kiedy ładujesz stronę, div przylega do jej dolnej części. Następnie, gdy użytkownik przewinie w dół, przyklei się do góry.

Mogę zrobić kij do górnej części za pomocą lepkiego elementu.

<div id="container">
<div id="menu">
&nbsp; &nbsp;&nbsp;<ul>
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<li><a href='#test'>Line 1</a></li>
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<li><a href='#'>Line 2</a></li>
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<li><a href='#'>Line 3</a></li>
&nbsp; &nbsp;&nbsp;</ul>
</div>
</div>

<script type="text/javascript">
&nbsp; &nbsp;&nbsp;$(document).ready(function(){
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$(window).scroll(function(){
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;if($(this).scrollTop()>=660)
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;{
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$('#menu').addClass('fixed');
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}else{
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$('#menu').removeClass('fixed');
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;});
&nbsp; &nbsp;&nbsp;});
&nbsp; &nbsp;&nbsp;</script>

Po prostu nie mogę tego zrobić, więc przykleja się do ładunku. Dołączam małą makietę, jeśli jest niejasna.