无限滚动的小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 150200232232...232重复很多次. 然后又是49.6

Answer 1

已经找到答案啦. 
container的scrollLeft不可无限增大. 当450的包含框向左滚动了232px后, 682px的内容已经全部显示完成. 此时再给scrollLeft赋值并无意义. 
举个例子:

<div id="container"><!-- 450px -->
        <div id="content"><!-- 682px -->
            <ul>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
            </ul>
            <ul>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
                <li><img src="t1.jpg"></li>
            </ul>
        </div>
    </div>
    
    container.scrollLeft = 1000;//得到的还是232. 因为已经到达了临界点.