无法使用.animate（）来使用/ jQuery

Question

我有一个隐藏项目的溢出div。我想点击UP / DOWN元素滚动隐藏区域：

$("#up").click(function(){
    $("#container").find(".box:first").animate({"top": "+=20px"}, "slow");
});
$("#down").click(function(){
    $("#container").find(".box:first").animate({"top": "-=20px"}, "slow");
});

<style>
#itemsList {
    height:60px;
}
.box {
    height:20px;
}
</style>

<div id="container">                        
    <div id="up" class="scroll">UP</div>
    <div id="itemsList">
        <div id="item1" class="box">item 1</div>
        <div id="item2" class="box">qweqweqwe</div>
        <div id="item3" class="box">qqqqqqqq</div>
        <div id="item4" class="box">eeeeeee</div>
        <div id="item5" class="box">rrrrrrrr</div>
        <div id="item6" class="box">tttttt 11</div>
    </div>
    <div id="down" class="scroll">DOWN</div>
</div>

不确定我错过了什么......这是我的JSfiddle。

Answer 1

我将您的jQuery选择器从find('.box:first')更改为find('.box')，然后只需将position: relative;添加到CSS中的.box类。