随便打开一个网页,基本上都会看到无缝滚动或者轮播图,比如淘宝还有360官网的首页
观察这些轮播图可以发现图片可以来回循环地切换,那么是怎样做到的呢?
做到轮播图或者说无缝滚动主要有两种方式,一种是通过对图片的明暗即透明图的改变来显示或隐藏图片,另一种是通过运动框架,将图片显示在可视区域。这两种方式都会用到同一个东西,那就是定时器。
JavaScript中的定时器有两种,1.setInterval();2.setTimeout();相对应的关闭定时器也有两种方法,clearInterval()和clearTimeout()。两种定时器的区别是前者可以执行多次,而后者只执行一次。
这次只说无缝滚动,下篇介绍轮播图。
实现简单的无缝滚动的代码如下:
代码*/