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

Question

我有滚动的 javascript 函数。

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

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

    <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()"/>
<

On click of button i am trying to scroll screen to particular id but it is somehow not working

Answer 1

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

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

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