css实现一闪而过的光影效果

看到一个

css光影一闪而过 css 色泽效果


然后我在项目中希望这个光影效果 一直闪烁,所以在原有的基础上进行了改进。

下面粘代码:

@-webkit-keyframes showimg{
0% {
position: absolute;  
   left: -100%;                  
   top: 0;  
   width: 30%;  
   height: 100%;  
   content: ""; 
   background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 50%,rgba(255,255,255,0) 100%);  
   transform: skewX(-45deg);
   transition: 1s ease; 
}
100% {
left: 300%;  
        transition: 1s ease; 
}
}

 .item span{
   -webkit-animation:showimg 4s infinite linear ;
}


在此感谢@小沈童鞋 提供的思路


版权声明:本文为Daisy__xu原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。