MICUU
微资讯
声卡
创新2024全套教程
5.1声卡全套
创新声卡驱动
板载声卡调试全套教程
Sam机架安装
Sam机架
音效助手
专题
文档
技术文档汇总
站内文档
更多
软件
更新日志
关于
装机必备
Gramos模板
光年后台模板
Betube模板
美图
友情链接
站内导航
关于
搜索
退出登录
登录
原创
WOW.js加animate.css – 让页面滚动更有趣,页面滚动到div节点显示动效
2020-08-20
41.03w热度
> 很多页面用户在鼠标向下滚动的时候,有些元素会产生细小的动画效果。 虽然动画比较小,但却能吸引你的注意。如果你希望你的页面也更加有趣,那么你可以试试 WOW.js。 下载地址: animate.css http://micuer.com/public/soft/animate.css wow.min.js http://micuer.com/public/soft/wow.min.js > 使用教程: 1:引入相关插件以及css插件 ``` <link rel="stylesheet" href="css/animate.min.css"> <script src="__STATIC__/js/wow.min.js"></script> ``` 2:页面布局添加class ``` <div class="wow slideInLeft"></div> <div class="wow slideInRight"></div> ``` 3:页面添加class 以及 时间显示 ``` <div class="wow slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></div> <div class="wow slideInRight" data-wow-offset="10" data-wow-iteration="10"></div> ``` 4:页脚js初始化 ``` new WOW().init(); ``` 如果需要自定义配置,可如下使用: ``` var wow = new WOW({ boxClass: 'wow', animateClass: 'animated', offset: 0, mobile: true, live: true }); wow.init(); ``` 其他动效可参考地址: https://www.dowebok.com/131.html
注:原创不易,转载请注明出处(
https://micuu.com/new/851.html
),本站所有资源来源于网络收集,如有侵权请联系QQ245557979进行清除。
最后修改与 2022-02-18
上一篇:
抖音亚鑫掉粉,到底是什么原因导致的?
下一篇:
动效,类似wow.js-Html页面动画效果插件scrollReveal.js使用教程
留言反馈
请先登录
问题反馈渠道,如有软件无法下载或者其他问题可反馈。【由于某种原因,目前留言不展示】
用户需要登录后才能留言反馈
立即留言
珍藏视频
10分钟高效燃脂
30天高效瘦脸操
5分钟缓解颈椎操
友人
微博
全民K歌
唱吧
今日头条
悠悠网
科技小锅盖
彼岸桌面
阮一峰
laravel社区
V2ex
掘金
更多>