幻循环滚动波动画效果图
教程开始(狐狸库原创)
将下面代码放入WordPress后台-子比主题设置-全局-自定义代码-自定义css代码中
本文付费阅读内容 – 大SVIP会员免费
.parallax {
fill: var(–body-bg-color);
}
.parallax > use {
animation: move-forever 30s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
}
.parallax > use:nth-child(1) {
animation-delay: -2s;
animation-duration: 7s;
opacity: 0.5;
}
.parallax > use:nth-child(2) {
animation-delay: -3s;
animation-duration: 10s;
opacity: 0.6;
}
.parallax > use:nth-child(3) {
animation-delay: -4s;
animation-duration: 13s;
opacity: 0.7;
}
.parallax > use:nth-child(4) {
animation-delay: -5s;
animation-duration: 20s;
opacity: 1;
}
@keyframes move-forever {
0% {
transform: translate3d(-90px, 0, 0);
}
100% {
transform: translate3d(85px, 0, 0);
}
}
将下面js代码放入自定义代码中的自定义底部HTML
本文付费阅读内容 – 大SVIP会员免费
<script src=“/wp-content/themes/zibll/moxing/js/tengfei_slide_wave.js”></script>
下载附件上传到/wp-content/themes/zibll中即可
Ctrl+D收藏我们
部分内容来自于网络 如有不妥联系站长删除！
本站用户发帖仅代表本站用户个人观点，并不代表本站赞同其观点和对其真实性负责。
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负！
© 版权声明
本站收集的资源仅供内部学习研究软件设计思想和原理使用，学习研究后请自觉删除，请勿传播，因未及时删除所造成的任何后果责任自负。
如果用于其他用途，请购买正版支持作者，谢谢！若您认为「CHUANGFUYE.COM」发布的内容若侵犯到您的权益，请联系站长邮箱:554286@qq.com 进行删除处理。
本站资源大多存储在云盘，如发现链接失效，请联系我们，我们会第一时间更新。THE END
暂无评论内容