1. 程式人生 > 實用技巧 >css3 簡單的玻璃掃光效果

css3 簡單的玻璃掃光效果

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