摘要:但是定时器没关。通过变量来控制定时器内函数的执行停止播放默认为。方式三通过关闭定时器来停止轮播图的运动。,通过传入定时器的编号来。清除定时器,再开启定时器。所以,每次打开定时器,先清除前一个。点击页面任何一个位置关闭定时器。
1.定时器
定义:当我们需要隔一段时间,再执行一段代码。或者每隔一段时间,执行一段代码。我们可以使用定时器。
使用场景:例如网站轮播图的自动滚动。广告延迟弹出的某些操作
定时器-setInterval基本定义
setInterval
间隔型定时器:每隔一段时间执行一段代码。
注意:代码一般会重复执行
语法
setInterval(函数,时间间隔);
eg:
setInterval(fn,20);指的是每隔20 毫秒执行一段函数
时间间隔的单位 : 是毫秒(ms)1s = 1000ms
返回值
setInterval(重复执行的代码,时间间隔);这段代码的返回值是分配定时器一个独有的编号。这个编号跟关闭定时器有关。当你开启很多定时器的时候,你想关闭哪一个定时器,就需要知道对应的编号然后关闭。就是每开启一个定时器,会给这个定时器贴一个编号,编号是数字类型的,会由这段代码的返回值传递出编码。
使用举例1—无参函数
使用举例2—有参函数
注意:
以下是代码执行结果:先打印222和333。之后1s后打印1.
Title
自动播放效果,可以点击查看。因为codepen不方便放图片,就用颜色代替
4.setInterval—轮播图的停止css样式我就删除了,直接给出js和html。需要全部代码的可以从链接下面去看。点击链接中的css,html,js都可以查看对应的代码。
方式一:控制步长来停止轮播图的运动,但是定时器还没关(听语言描述可能有些模糊,直接上代码)
通过步长来控制停止轮播图的运动,点击查看效果