时间:2019-03-18
浏览量:
CSS3 animation属性制作图片高光扫描效果代码
header .logo-brand img { height: 66px; width:100%; float: left; margin-top:40px; } .logo-brand{position: relative; overflow: hidden;} .logo-brand:before {content: "";position: absolute; width: 330px; height: 70px; background-color: rgba(255, 255, 255, 0.5); -webkit-transform: rotate(60deg); transform: rotate(60deg); left: -100px; -webkit-animation: blink 1.5s infinite both; animation: blink 1.5s infinite both;} @-webkit-keyframes blink {from {left: -300px;top: 0;} to {left: 330px;top: 0;}} @-o-keyframes blink {from {left: -300px;top: 0;} to {left: 330px;top: 0;}} @-moz-keyframes blink {from {left: -300px;top: 0;} to {left: 330px;top: 0;}} @keyframes blink {from {left: -300px;top: 0;}to {left: 330px;top: 0;}}
RELATED RECOMMEND