I have a div, and a container div. This div is my footer. I want to beable to slide items up out of the footer.

However, when I use the toggle() and use marginTop/marginBottom it slides perfectly, but only expands the div downwards thus causing scrollbars to appear.

Is it possible to define which way you would like a div to expand?

So just to be clear here is my code:

1. <style>
2. #footer-container
   {
       overflow:hidden;
       z-index:100;
       position:relative;
       border:1px solid #f00;
       width:1000px;   
       margin:auto;
   }
   #footer
   {
       width:1000px;   
       margin:auto;
       height:32px !important;
       background: url('../../img/footer/footer_bg.png') repeat-x;
       font-family:Arial, Helvetica, sans-serif;
       font-size:10px;
       color:#555;
       margin-bottom:0;
       bottom:0;
       padding:0;
   }
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   

1. <div id="footer-container">
2.         <div id="footer">
3.                 some contend links etc..
4.         </div>
5. </div>
   

as you can see from above there is an overflow of hidden set to the container div. the footer div has a height of 32px and bg image. The only way I can get this to work is if I put a postion:fixed on the #footer. This is not what I want, because it then remains on top/in position when scrolling the page.

So, is it possible to set a div's expansion direction in jQuery? The above expands the div downards. I would like to epxand it upwards.