Question

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

所以，我想在鼠标悬停时向下滚动“.punchmeintheface”div，同时我想在mouseleave时自动将div滚动回顶部。

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

和jquery

var amount = '';
function scroll() {
    $('.punchmeintheface').animate({
        scrollTop: amount
    }, 100, 'linear',function() {
        if (amount != '') {
            scroll();
        }
    });
}
$('.punchmeintheface').hover(function() {
    amount = '+=20';
    scroll();
}, function() {
    amount = '';
});

和css（如果需要）

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

这是我目前的工作：http://jsfiddle.net/sandalkoyak/GhLCt/

请看看并帮助我。谢谢！

Answer 1

只需编辑此部分

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

http://jsfiddle.net/GhLCt/1/

悬停以向下滚动div并在mouseleave时自动滚动到顶部

1 个答案: