实现无缝滚动与间歇性无缝滚动

    这篇blog是使用html与js实现无缝滚动与间歇性无缝滚动，首先，先看一下效果图：

    这种效果，在网站中经常见到，下面，我们实现这个效果。

首先，这里有以下知识点：

    这里给大家贴一张w3c上对setInterval的介绍，用法都很清楚：

setInterval()与clearInterval的简单用法

    接下来，开始我们的主题了：

无缝滚动

html文件：

    这里实现无缝滚动的原理是：     页面打开的时候，如图1，让ol1开始向上滚动，当ol1滚动到图2的位置，继续向上滚动，这时ol2（ol2是ol1的一个克隆，与ol1一模一样的数据）就显示出来，当ol1滚动到图三的位置时，就让ol1回到初始位置，图1的那个位置.整个滚动的原理就是这样。 图1： 图2： 图3：

贴上我们的js代码：

    注释里写的很清楚，也没有多少困难，应该不会有什么问题。

间歇性无缝滚动

    间歇性无缝滚动与无缝滚动很相似，只是在无缝滚动的基础上增加了停留时间，让它每隔多少秒之后再执行向上滚动的操作。 这里我们要学习一个新的知识点：

贴上js代码：     代码与无缝滚动的代码大同小异，主要是多了setTimeout来进行延迟滚动。     逻辑：页面启动后延迟2秒执行move(),在move()中执行向上滚动的逻辑，其中每隔50毫秒执行一次stop()，当滚动的区域是一行数据的整数倍时，停止1秒后继续执行move()滚动。当滚动区域是整个的一半时（因为在开始的时候克隆了一个area，area变成两个相同的数据），将恢复到初始状态，无限滚动下去。

    至此，无缝滚动完成。