滚动在溢出属性设置为滚动的 div 中不起作用

Question

我有滚动的javascript函数。

    <script type="text/javascript">
    function scroll() {
    $('html,body').animate({
    scrollTop: $('#3').offset().top}, 2000);
    }
    </script>

在 html 部分，我有一个 div，其溢出属性设置为滚动。 #CamListDiv{ 溢出：滚动； 高度：400 像素 }

    <div id="CamListDiv">
    <div id="1">
    <h1>2</h1>
    <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
    </div>
    <div id="2">
    <h1>1</h1>
    <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
    </div>
    <h1>4</h1>
    <p>dddddddddddddddd</p>
    <h1>6</h1>
    <p>fffffffffffffffffffffff</p>
    <h1>7</h1>
    <p>dskfjdlskjflskdjflsdkjfl</p>
    <h1>8</h1>
    <p>sdfdsfsdgsgsgg</p>
    <h1>9</h1>
    <p>fhjlsdkj</p>
    <h1>10</h1>
    <div id="3">
    <h1>5</h1>
    <p>eeeeeeeeeeee</p>
    </div>
    </div>
    <input type="button" value="scroll" onclick="scroll()"/>
<

单击按钮时，我试图将屏幕滚动到特定 ID，但它无法正常工作

Answer 1

您需要滚动您的 div 而不是整个页面：

$('input').click(function() {
    $('#CamListDiv').animate({ scrollTop: $('#3').offset().top }, 2000);
    return false;
});

http://jsfiddle.net/mrCb6/2/