css3 简单的玻璃扫光效果

 .ss {
  display: block;
  width: 800px;
  height: 370px;
  position: absolute;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, .3), rgba(0, 0, 0, 0));
  left: 0;
  top: 0;
  transform: rotate(-45deg) translate(0, -360px);
 animation: saoguangc 1s linear infinite;
    -webkit-animation: saoguangc 1s linear infinite;  
}
@-webkit-keyframes saoguangc {
    0% {
        transform:  rotate(-45deg) translate(0, 100px);
        -webkit-transform:  rotate(-45deg) translate(0, 100px);

    }
   
    100% {
        transform:  rotate(-45deg) translate(0, 400px);
        -webkit-transform:  rotate(-45deg) translate(0, 400px);
    }
}
@keyframes saoguangc {
     0% {
        transform:  rotate(-45deg) translate(0, 100px);
        -webkit-transform:  rotate(-45deg) translate(0, 100px);

    }
   
    100% {
        transform:  rotate(-45deg) translate(0, 400px);
        -webkit-transform:  rotate(-45deg) translate(0, 400px);
    }
}

 

相关文章:

  • 2022-12-23
  • 2021-07-05
  • 2021-06-26
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-07-27
  • 2021-12-29
  • 2021-10-25
  • 2022-12-23
相关资源
相似解决方案