教程开始
下面代码放入WordPress后台-zibll主题设置-全局-自定义JavaScript代码
ENLIGHTERJS_CODEBLOCK_0
下面代码添加到自定义css即可
.posts-item.alone {position:relative;overflow:hidden;transition:all .3s ease;}
.posts-item.alone:hover {position:relative;z-index:1;transform:translateY(-2px);box-shadow:0 2px 5px rgba(0,0,0,.2),0 0 0 2px #007bff,0 0 8px rgba(0,123,255,.5);}
.posts-item.alone:hover:before,.posts-item.alone:hover:after {content:"";position:absolute;z-index:-1;top:0;bottom:0;width:30%;background:linear-gradient(to right,rgb(186 201 217/50%),rgba(0,0,0,0));}
.posts-item.alone:hover:before {left:-30%;transform:skewX(-30deg);animation:scanLeft 2s linear infinite;}
.posts-item.alone:hover:after {right:-30%;transform:skewX(30deg);animation:scanRight 2s linear infinite;}
@keyframes scanLeft {0% {left:-30%;}
100% {left:100%;}
;}
@keyframes scanRight {0% {right:-30%;}
100% {right:100%;}
;}
查看更多心仪的内容 按Ctrl+D收藏我们
部分内容来自于网络 如有不妥联系站长删除
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!
© 版权声明
THE END
暂无评论内容