Jquery 鼠标悬停可向下滚动div，鼠标离开时自动滚动至顶部

惠。我目前正在研究这个jquery代码，这些代码工作得很好。但由于我对jquery的理解非常有限，我无法真正调整代码以满足我的需要

因此，我想在鼠标悬停在“.punchmeintheface”div上时向下滚动该div，同时我想在鼠标移动时自动将该div滚动回顶部

<div class="punchmeintheface">
   <img src="http://img29.imageshack.us/img29/2333/q4sl.jpg" alt="" />
</div>

如果需要，还有css

  .punchmeintheface {
    width: 640px;
    height: 100px;
    overflow-y:auto; 
    overflow: hidden;
  }

这是我目前的工作：

请看一看，帮帮我。谢谢

只需编辑此部分

$('.punchmeintheface').hover(function() {
    amount = '+=20';
    scroll();
}, function() {
    amount = '0'; //<----- here
});

$（'.punchmeintheface'）.hover（函数（）{
金额='+=20'；
滚动（）；
}，函数（）{
amount='0'；//嘿，伙计！这太棒了！！但是有没有可能让它向上滚动慢一点呢？但实际上这已经足够酷了！谢谢！如果你想让它慢一点，只需将动画时间更改为：
amount==''0'？500:100
。演示：
$('.punchmeintheface').hover(function() {
    amount = '+=20';
    scroll();
}, function() {
    amount = '0'; //<----- here
});