jq scrollTop

Question

scrollTop 为什么不起作用

<div class="box">
    <ul class="ul1" style="position: relative;top: 0;">
        <li>滚动1</li>
        <li>滚动2</li>
        <li>滚动3</li>
        <li>滚动4</li>
        <li>滚动5</li>
        <li>滚动6</li>
    </ul>
</div>

*{margin:0;padding:0;}
li{list-style: none;}
.box{width: 200px;height:30px;margin: 100px auto;background-color: #ccc;text-align: center;
    overflow: hidden;}
.box li{line-height: 30px;}

<script>
    //设置定时器，每隔1秒向上滚动一次，
    $(function () {
        var num = 0;
        setInterval(function(){
            num-=30;
            $(".ul1").animate({'scrollTop':num},50)
        },1000);
    })
</script>

Answer 1

num -= 30;
=>
num += 30;

.ul1 { overflow: auto; height: 30px;}

Answer 2

ul没高度？？

Answer 3

.box {position:relative;}
.box ul {position:absolute; left:0;}

<ul class="ul1" style="top:0;">

这样才合理