//5.鼠标离开大盒子,开启定时器
//注册事件
slider.addEventListener('mouseleave',function(){
//开启定时器
timerId = setInterval(function(){
//利用js自动调用点击事件(右侧按钮事件next.click())
next.click()
},1000)
})
轮播图自动切换效果:
1.开启定时器,自动切换:
//3.自动播放模块
let timerId = setInterval(function(){
//利用js自动调用点击事件(右侧按钮事件next.click())
next.click()
},1000)
2.鼠标经过大盒子时,关闭定时器
//4.鼠标经过大盒子,停止定时器
const slider = document.querySelector('.slider')
//注册事件
slider.addEventListener('mouseenter',function(){
//停止定时器
clearInterval(timerId)
})
3.鼠标离开大盒子时,开启定时器
//5.鼠标离开大盒子,开启定时器
//注册事件
slider.addEventListener('mouseleave',function(){
//开启定时器
timerId = setInterval(function(){
//利用js自动调用点击事件(右侧按钮事件next.click())
next.click()
},1000)
})
4.总结:注意,只用定义一个定时器。