短视频带货源码，鼠标悬停在半透明遮罩层上，自动拉起降下的动画效果

//	鼠标悬停在半透明遮罩层上，自动拉起
var small1List = document.querySelectorAll('.smal')
//console.log(small1List);//NodeList
for(let element of small1List){
     
//鼠标移动到.small上方，则全部显示.small
       let time = null;
       element.οnmοuseenter= function(){
     
         let mask = element.querySelector('.mask')
         //mask.style.top = '0';
         let top = 156;
         console.log('mouserover')
         //动画效果
         if(timer===mull){
     
           timer = setInterval(()=>{
     
            top -= 10;
            if(top>=0){
     
             clearInterval(timer);
             timer = null;
             top = 0;
          }
          mask.style.top = top+'px';
        },22);
     }
  } 
  //鼠标移出
  element.onmouseleave = function(){
     
     let mask = element.querySelector('.mask');
      //mask.style.top = '156px';
      let top = 0;
      if(timer===null){
     
      timer = setInterval(()=>{
     
        top += 10;
        if(top>=156){
     
           clearInterval(timer)
           timer=null;
           top=156;
         }
         mask.style.top = top+'px';
       },22)
     }
 }
}

以上就是关于短视频带货源码，自动拉起下降动画效果实现的相关代码，想要了解更多信息，欢迎关注之后的文章
本文转载自网络，转载仅为分享干货知识，如有侵权欢迎联系云豹科技进行删除处理