javascript - 滚动到包装器内的 Div，而不是正文

Question

我正在使用 http://www.dconnell.co.uk/blog/index.php/2012/03/12/scroll-to-any-element-using-jquery/ 中的 jQuery 代码滚动到 Wrapper 内的 Div。

提供的代码对主体进行动画处理(在单击时向下滚动主体)我正在尝试对 div 内的滚动进行动画处理，而不是对主体进行动画处理。

我的代码如下:

HTML:

    <a href="#Div3" class="ScrollDown">Scroll Down</a>

    <div class="Wrapper" style="height:400px; width:600px; overflow:hidden;">
       <div id="Div1" style="height:200px; width:600px;"></div>
       <div id="Div2" style="height:200px; width:600px;"></div>
       <div id="Div3" style="height:200px; width:600px;"></div>
   </div>

jQuery

function scrollToElement(selector, time, verticalOffset) {
    time = typeof(time) != 'undefined' ? time : 1000;
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0;
    element = $(selector);
    offset = element.offset();
    offsetTop = offset.top + verticalOffset;
    $('html, body').animate({
        scrollTop: offsetTop
    }, time);
}

$(document).ready(function() {
    $('a.ScrollDown').click(function (e) {
    e.preventDefault();
    scrollToElement('#Div3');
    }); 
}); 

我知道它与 $('html, body').animate({ }) 有关，但我不确定如何更改它。

谢谢

JSFiddle http://jsfiddle.net/3Cp5w/1/

Answer 1

对包装器而不是主体进行动画处理:

$('.Wrapper').animate({
    scrollTop: offsetTop
}, time);

http://jsfiddle.net/robbyn/qU6F7/1/