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 ;
}


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

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值