从底部向上滑动div以阅读更多内容

Question

我正在尝试从div下面滑动文本。每个文本都有可变长度。我创建了以下JSFiddle：

http://jsfiddle.net/Ronnos/5AnRk/1/

这里的问题是它向下滑动而不是向上滑动（其他菜单项向上移动）。我希望其他项目保留在页面底部。

我知道到目前为止我所取得的成就可以通过CSS和过渡轻松完成：

.item-reader {display:none}
.menu-item:hover > .item-reader {display:block}

但我想将其向上滑动（这是另一个例子：http://return-true.com/2010/03/creating-a-slide-up-footer-using-jquery/）

谢谢有人帮助我！

Answer 1

http://jsfiddle.net/5AnRk/4/

Jquery：

$('.menu-item').hover(
    function() { 
        $(this).children('.read-more').show();
        $(this).animate({'marginTop' : '-25px'} );
    }, function(){
        $(this).animate({'marginTop' : '0px'}, function(){
            $(this).children('.read-more').hide(); 
        });
    }
);

CSS：

#menu-wrapper {
  position:fixed;
  bottom:0;
  width: 100%;
  z-index: 100;
  height: 50px;
}