- <script>
- new WOW().init();
- </script>
代 
step2入wow.js程式方法1:下及安
- <!-- wow.js v1.1.2 -->
- <script href="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
代
方式2:CDN
文章出:Netyea
性/方法 | 型 | 默值 | 申明 |
boxClass | 字符串 | 'wow' | 需要履行的元素的class |
animateClass | 字符串 | 'animated' | animation.css 的class |
offset | 整 | 0 | 用到距才入手下手行 |
mobile | 布值 | true | 是不是在步履置上行 |
live | 布值 | true | 非同步生的容是不是要套用 |
《安方式》
step1入animate.css方式
1:下及安
《》
wow.js 利用 【 data-*】加入值
step1元素,增加【.wow】class名便可引入wow.js利用。
step2考animate.css定型,其照表一表,保持位置 - data-wow-duration:更改持候
- data-wow-delay:始之前的延
- data-wow-offset:始的距(器底部相)
- data-wow-iteration:的次反
- <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>
代 - <link rel="stylesheet" href="animate.css">
代 - <script>
- var wow = new WOW({
- boxClass: 'wow', // 欲套用wow.js的class (wow)
- animateClass: 'animated', // 欲定animat.css 的名 (animated)
- offset: 0, // 用到距才入手下手履行 (是0)
- mobile: true, // 是不是在作置上行 (是true)
- live: true // 非同步生的容是不是要套用 是true)
- });
- wow.init();
- </script>
代
方式2:CDN保持,考站
《根基用法》
- <script src="wow.js"></script>
代 - <!-- Animate.css v3.7.2 -->
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.css">
代
step3wow.js新物件
型
《自界Script》
如需要自行界配置,可藉由wow.js新物件立自
展址:我旁

- <div class="wow bounce">Example</div>
代
配置值明
文章定位: