无限滚动的小DEMO, 逻辑哪里出错了?

Question

我写个无限滚动的小DEMO, 给scrollLeft赋值时, 到了某个值就会重复给了赋值. 这个是什么原因?. 
代码:

<script type="text/javascript">
    var con = document.getElementById("container"),
        uls = document.getElementsByTagName("ul"),
        t = 0, step = 50, temp = 5;
        setInterval(function(){
            t = t + step;            if (t >= uls[0].offsetWidth) {//uls[0].offsetWidth的值为682
                t = step;
            }
            con.scrollLeft = t;            console.log(con.scrollLeft);
        },1000)    </script>

输出: 
49.6 
100 
150
200
232
232
...
232重复很多次. 
然后又是
49.6

Answer 1

已经找到答案啦.&nbsp;container的scrollLeft不可无限增大. 当450的包含框向左滚动了232px后, 682px的内容已经全部显示完成. 此时再给scrollLeft赋值并无意义.&nbsp;举个例子:<div&nbsp;id="container"><!--&nbsp;450px&nbsp;--> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<div&nbsp;id="content"><!--&nbsp;682px&nbsp;--> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ul> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</ul> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ul> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li><img&nbsp;src="t1.jpg"></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</ul> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div> &nbsp;&nbsp;&nbsp;&nbsp;</div> &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;container.scrollLeft&nbsp;=&nbsp;1000;//得到的还是232.&nbsp;因为已经到达了临界点.