css实现图片鼠标滑过镜头炫光效果
css样式文件
.thumb{position:relative}
.thumb img{border:1px solid #ddd;padding:4px;height:150px!important}
.thumb em{position: absolute;left: -290px;top: 0px;width: 150px;height: 160px;background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));backg--round-color: red;overflow: hidden;-webkit-transform: skewx(-25deg);-webkit-transition: 0s;}
.thumb:hover em{width: 150px;left:710px;-webkit-transition:0.8s}
html代码文件
开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明css实现图片鼠标滑过镜头炫光效果!