原生JS实现鼠标悬停在半透明遮罩层上，自动拉起降下的动画效果

�MFL

于 2020-05-12 00:34:12 发布

阅读量706

点赞数

分类专栏：原生JS动画文章标签： javascript

本文链接：https://blog.youkuaiyun.com/mafeilong618/article/details/106065513

版权

本文介绍如何利用JavaScript实现一个鼠标悬停在半透明遮罩层上时，自动触发降下动画的效果。重点在于使用onmouseenter事件替代onmouseover，确保更精确的交互体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

话不多说，直接上代码：

//	鼠标悬停在半透明遮罩层上，自动拉起
var small1List = document.querySelectorAll('.smal')
//console.log(small1List);//NodeList
for(let element of small1List){
   
//鼠标移动到.small上方，则全部显示.small
       let time = null;
       element.onmouseenter= function(){
   
         let mask =

最低0.47元/天解锁文章