平时工作中很多场合都要用到定时器，比如延迟加载、定时查询等等，但定时器的控制有时候会有些许麻烦，比如鼠标移入停止、移出再重新开始。这次介绍几个借助 CSS 来更好的控制定时器的方法，一起了解一下吧，相信可以带来不一样的体验
一、hover 延时触发
有这样一个场景，在鼠标停留在一个元素上1s后才触发事件，不满1s就不会触发，这样的好处是，可以避免鼠标在快速划过时，频繁的触发事件。如果是用js来实现，可能会这样
var timer = null
el.addEventListener('mouseover', () => {
timer && clearTimeout(timer)
timer = setTimeout(() => {
// 具体逻辑
}, 1000)
})
复制代码是不是这样？等等，这样还没完，这样只做到了延时，鼠标离开以后还是会触发，还需要在鼠标离开时取消定时器
el.addEventListener('mouseout', () => {
timer && clearTimeout(timer)
})
复制代码另外，在使用mouseout时还需要考虑 dom 嵌套结构，因为这些事件在
