JavaScript使用动画滚动到div

Question

我有一个PhoneGap应用程序,当它打开一个HTML页面时,我希望它滚动到一个特定的<div>元素.到目前为止,我已经能够使用jQuery使用这个脚本来做到这一点:

<script>
$(document).delegate('.ui-page', 'pageshow', function () {
     var offset = $(this).find('#timeindicatordiv').offset().top;
     setTimeout(function () {
        $.mobile.silentScroll(offset);
        }, 0);
     });
</script>

这只能让我直接跳到<div>看起来有点不稳定的地方.

有没有办法给这个平滑的动画？

Answer 1

您可以执行以下操作:

var scrollToElement = function(el, ms){
    var speed = (ms) ? ms : 600;
    $('html,body').animate({
        scrollTop: $(el).offset().top
    }, speed);
}

// specify id of element and optional scroll speed as arguments
scrollToElement('#timeindicatordiv', 600);

jsfiddle/example:http://jsfiddle.net/dtR34/4/