v0.0.6

README.md

@@ -69,7 +69,7 @@ git clone https://github.com/Five-great/wx-wow.git
 
 ```
 
-### 4. 在需要加入动效的地方的 `class` 加入 `" {{wx.WOW()}}   <动效名称>"`， 例如 `" {{wx.WOW()}} bounceInUp "`， 同时需要给该动效分配一个 `id `具体通过  `{{wx.WOWId()}}`  去自动分配到 `data-wx-wow-id` 上，如下面的例子。
+### 4. 在需要加入动效的地方的 `class` 加入 `" {{wx.WOW()}}   <动效名称>"`， 例如 `" {{wx.WOW()}} bounceInUp "`， 同时需要给该动效分配一个 `id `具体通过  `{{wx.WOWId()}}`  去自动分配到 `data-wx-wow-id` 上 ，并且确保添加动画的display 属性为 块状 或行块状，不能为行类样式 如下面的例子。
 
 ```html
  <view class=" {{wx.WOW()}} bounceInUp"  data-wx-wow-id="{{wx.WOWId()}}" > ... </view>
@@ -95,7 +95,8 @@ git clone https://github.com/Five-great/wx-wow.git
 
 <view class="{{wx.WOW()}} fadeOut"  data-wx-wow-id="{{wx.WOWId()}}"  data-wx-wow-delay="0.8s"  data-wx-wow-duration="3s" > ... </view>
 ```
-
+## Demo
+[点击查看代码片段](https://developers.weixin.qq.com/s/llE4M7m67rnC)
 ## 支持
 
 

miniprogram_npm/wx-wow/index.js

@@ -8,7 +8,7 @@ __DEFINE__(1609375917881, function(require, module, exports) {
 module.exports =require('./src/wxWOW')
 }, function(modId) {var map = {"./src/wxWOW":1609375917882}; return __REQUIRE__(map[modId], modId); })
 __DEFINE__(1609375917882, function(require, module, exports) {
-function setWatcher(a){observe(a,"data",function(e,b,c){var d=this;if("data.wxwow"==e||this.data.$fv_wxWoWDataObserved)return 0;setTimeout(function(){ScrollFunc(d)},200)},!0,a,"data")}function observe(a,e,b,c,d,h){var f=a[e];c&&null!=f&&"object"===typeof f&&Object.keys(f).forEach(function(g){"__webviewId__"!=g&&"Object"!=g&&"$fv_wxWoWDataObserve"!=g&&"$fv_wxWoW"!=g&&observe(f,g,b,c,d,h+"."+g)});Object.defineProperty(a,e,{configurable:!0,enumerable:!0,set:function(g){b.call(d,h,g,f);f=g;c&&null!=f&&"object"===typeof f&&observe(a,e,b,c,d,h)},get:function(){return f}})}var ScrollFunc=function(a){wx.createSelectorQuery().selectAll(".wx-wow").boundingClientRect(".wx-wow").exec(function(e){"object"==typeof e[0]&&e[0].forEach(function(b){var c=b.dataset.wxWowId,d=b.dataset.wxWowOffset?parseInt(b.dataset.wxWowOffset):.15*a.data.$fv_wxwowHeight;a.data.$fv_wxwowHeight-d>b.top&&-1==a.data.$fv_wxWoW.oldlist.indexOf(c)&&(a.data.$fv_wxWoW.oldlist.push(c),a.data.$fv_wxWoWDataObserved?"":a.setData({$fv_wxWoWDataObserved:!0}),a.data.wxwow={idx:".wowId-"+c,prefix:"animated",delayTime:b.dataset.wxWowDelay?b.dataset.wxWowDelay:"",durationTime:b.dataset.wxWowDuration?b.dataset.wxWowDuration:"",iteration:b.dataset.wxWowIteration?b.dataset.wxWowIteration:""},a.setData({wxwow:a.data.wxwow}))})})},$FV_WXWOW={OnLoadFunc:function(a){var e=this;wx.getSystemInfo({success:function(b){e.setData({$fv_wxwowHeight:b.screenHeight,$fv_wxwowWidth:b.screenWidth,$fv_wxWoWDataObserve:null,$fv_wxWoWDataObserved:!1,$fv_wxWoW:{oldlist:[]},wxwow:{}});setWatcher(e)}})},OnShowFunc:function(a){},OnPageScrollFunc:function(a){ScrollFunc(this)}},$fv_wowPage=Page;module.exports=function(a){var e=a.onPageScroll,b=a.onShow;a.onLoad=function(c){return function(d){"function"==typeof $FV_WXWOW.OnLoadFunc&&$FV_WXWOW.OnLoadFunc.call(this,d);c&&c.call(this,d)}}(a.onLoad);a.onShow=function(c){return function(d){"function"==typeof $FV_WXWOW.OnShowFunc&&$FV_WXWOW.OnShowFunc.call(this,d);c&&c.call(this,d)}}(b);a.onPageScroll=function(c){return function(d){"function"==typeof $FV_WXWOW.OnPageScrollFunc&&$FV_WXWOW.OnPageScrollFunc.call(this,d.scrollTop);c&&c.call(this,d)}}(e);return $fv_wowPage.call(this,a)};
+function setWatcher(a){observe(a,"data",function(e,b,c){var d=this;if("data.wxwow"==e)return 0;setTimeout(function(){ScrollFunc(d)},200)},!0,a,"data")}function observe(a,e,b,c,d,h){var f=a[e];c&&null!=f&&"object"===typeof f&&Object.keys(f).forEach(function(g){"__webviewId__"!=g&&"Object"!=g&&"$fv_wxWoWDataObserve"!=g&&"$fv_wxWoW"!=g&&observe(f,g,b,c,d,h+"."+g)});Object.defineProperty(a,e,{configurable:!0,enumerable:!0,set:function(g){b.call(d,h,g,f);f=g;c&&null!=f&&"object"===typeof f&&observe(a,e,b,c,d,h)},get:function(){return f}})}var ScrollFunc=function(a){wx.createSelectorQuery().selectAll(".wx-wow").boundingClientRect(".wx-wow").exec(function(e){"object"==typeof e[0]&&e[0].forEach(function(b){var c=b.dataset.wxWowId,d=b.dataset.wxWowOffset?parseInt(b.dataset.wxWowOffset):.15*a.data.$fv_wxwowHeight;a.data.$fv_wxwowHeight-d>b.top&&-1==a.data.$fv_wxWoW.oldlist.indexOf(c)&&(a.data.$fv_wxWoW.oldlist.push(c),a.data.$fv_wxWoWDataObserved?"":a.setData({$fv_wxWoWDataObserved:!0}),a.data.wxwow={idx:".wowId-"+c,prefix:"animated",delayTime:b.dataset.wxWowDelay?b.dataset.wxWowDelay:"",durationTime:b.dataset.wxWowDuration?b.dataset.wxWowDuration:"",iteration:b.dataset.wxWowIteration?b.dataset.wxWowIteration:""},a.setData({wxwow:a.data.wxwow}))})})},$FV_WXWOW={OnLoadFunc:function(a){var e=this;wx.getSystemInfo({success:function(b){e.setData({$fv_wxwowHeight:b.screenHeight,$fv_wxwowWidth:b.screenWidth,$fv_wxWoWDataObserve:null,$fv_wxWoWDataObserved:!1,$fv_wxWoW:{oldlist:[]},wxwow:{}});setWatcher(e)}})},OnShowFunc:function(a){setTimeout(()=>{ScrollFunc(this)},100);},OnPageScrollFunc:function(a){ScrollFunc(this)}},$fv_wowPage=Page;module.exports=function(a){var e=a.onPageScroll,b=a.onShow;a.onLoad=function(c){return function(d){"function"==typeof $FV_WXWOW.OnLoadFunc&&$FV_WXWOW.OnLoadFunc.call(this,d);c&&c.call(this,d)}}(a.onLoad);a.onShow=function(c){return function(d){"function"==typeof $FV_WXWOW.OnShowFunc&&$FV_WXWOW.OnShowFunc.call(this,d);c&&c.call(this,d)}}(b);a.onPageScroll=function(c){return function(d){"function"==typeof $FV_WXWOW.OnPageScrollFunc&&$FV_WXWOW.OnPageScrollFunc.call(this,d.scrollTop);c&&c.call(this,d)}}(e);return $fv_wowPage.call(this,a)};
 }, function(modId) { var map = {}; return __REQUIRE__(map[modId], modId); })
 return __REQUIRE__(1609375917881);
 })()

package.json

 {
   "name": "wx-wow",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "A CSS animation library is displayed when scrolling down the page.This project provides a convenient and easy-to-use animation implementation scheme for wechat Mini Program. By adding a simple animation class name and some simple parameters, the desired animation effect can be achieved.",
   "miniprogram": "dist",
   "main": "./index.js",

src/wxWOW.js

-function setWatcher(a){observe(a,"data",function(e,b,c){var d=this;if("data.wxwow"==e||this.data.$fv_wxWoWDataObserved)return 0;setTimeout(function(){ScrollFunc(d)},200)},!0,a,"data")}function observe(a,e,b,c,d,h){var f=a[e];c&&null!=f&&"object"===typeof f&&Object.keys(f).forEach(function(g){"__webviewId__"!=g&&"Object"!=g&&"$fv_wxWoWDataObserve"!=g&&"$fv_wxWoW"!=g&&observe(f,g,b,c,d,h+"."+g)});Object.defineProperty(a,e,{configurable:!0,enumerable:!0,set:function(g){b.call(d,h,g,f);f=g;c&&null!=f&&"object"===typeof f&&observe(a,e,b,c,d,h)},get:function(){return f}})}var ScrollFunc=function(a){wx.createSelectorQuery().selectAll(".wx-wow").boundingClientRect(".wx-wow").exec(function(e){"object"==typeof e[0]&&e[0].forEach(function(b){var c=b.dataset.wxWowId,d=b.dataset.wxWowOffset?parseInt(b.dataset.wxWowOffset):.15*a.data.$fv_wxwowHeight;a.data.$fv_wxwowHeight-d>b.top&&-1==a.data.$fv_wxWoW.oldlist.indexOf(c)&&(a.data.$fv_wxWoW.oldlist.push(c),a.data.$fv_wxWoWDataObserved?"":a.setData({$fv_wxWoWDataObserved:!0}),a.data.wxwow={idx:".wowId-"+c,prefix:"animated",delayTime:b.dataset.wxWowDelay?b.dataset.wxWowDelay:"",durationTime:b.dataset.wxWowDuration?b.dataset.wxWowDuration:"",iteration:b.dataset.wxWowIteration?b.dataset.wxWowIteration:""},a.setData({wxwow:a.data.wxwow}))})})},$FV_WXWOW={OnLoadFunc:function(a){var e=this;wx.getSystemInfo({success:function(b){e.setData({$fv_wxwowHeight:b.screenHeight,$fv_wxwowWidth:b.screenWidth,$fv_wxWoWDataObserve:null,$fv_wxWoWDataObserved:!1,$fv_wxWoW:{oldlist:[]},wxwow:{}});setWatcher(e)}})},OnShowFunc:function(a){},OnPageScrollFunc:function(a){ScrollFunc(this)}},$fv_wowPage=Page;module.exports=function(a){var e=a.onPageScroll,b=a.onShow;a.onLoad=function(c){return function(d){"function"==typeof $FV_WXWOW.OnLoadFunc&&$FV_WXWOW.OnLoadFunc.call(this,d);c&&c.call(this,d)}}(a.onLoad);a.onShow=function(c){return function(d){"function"==typeof $FV_WXWOW.OnShowFunc&&$FV_WXWOW.OnShowFunc.call(this,d);c&&c.call(this,d)}}(b);a.onPageScroll=function(c){return function(d){"function"==typeof $FV_WXWOW.OnPageScrollFunc&&$FV_WXWOW.OnPageScrollFunc.call(this,d.scrollTop);c&&c.call(this,d)}}(e);return $fv_wowPage.call(this,a)};
\ No newline at end of file
+function setWatcher(a){observe(a,"data",function(e,b,c){var d=this;if("data.wxwow"==e)return 0;setTimeout(function(){ScrollFunc(d)},200)},!0,a,"data")}function observe(a,e,b,c,d,h){var f=a[e];c&&null!=f&&"object"===typeof f&&Object.keys(f).forEach(function(g){"__webviewId__"!=g&&"Object"!=g&&"$fv_wxWoWDataObserve"!=g&&"$fv_wxWoW"!=g&&observe(f,g,b,c,d,h+"."+g)});Object.defineProperty(a,e,{configurable:!0,enumerable:!0,set:function(g){b.call(d,h,g,f);f=g;c&&null!=f&&"object"===typeof f&&observe(a,e,b,c,d,h)},get:function(){return f}})}var ScrollFunc=function(a){wx.createSelectorQuery().selectAll(".wx-wow").boundingClientRect(".wx-wow").exec(function(e){"object"==typeof e[0]&&e[0].forEach(function(b){var c=b.dataset.wxWowId,d=b.dataset.wxWowOffset?parseInt(b.dataset.wxWowOffset):.15*a.data.$fv_wxwowHeight;a.data.$fv_wxwowHeight-d>b.top&&-1==a.data.$fv_wxWoW.oldlist.indexOf(c)&&(a.data.$fv_wxWoW.oldlist.push(c),a.data.$fv_wxWoWDataObserved?"":a.setData({$fv_wxWoWDataObserved:!0}),a.data.wxwow={idx:".wowId-"+c,prefix:"animated",delayTime:b.dataset.wxWowDelay?b.dataset.wxWowDelay:"",durationTime:b.dataset.wxWowDuration?b.dataset.wxWowDuration:"",iteration:b.dataset.wxWowIteration?b.dataset.wxWowIteration:""},a.setData({wxwow:a.data.wxwow}))})})},$FV_WXWOW={OnLoadFunc:function(a){var e=this;wx.getSystemInfo({success:function(b){e.setData({$fv_wxwowHeight:b.screenHeight,$fv_wxwowWidth:b.screenWidth,$fv_wxWoWDataObserve:null,$fv_wxWoWDataObserved:!1,$fv_wxWoW:{oldlist:[]},wxwow:{}});setWatcher(e)}})},OnShowFunc:function(a){setTimeout(()=>{ScrollFunc(this)},100);},OnPageScrollFunc:function(a){ScrollFunc(this)}},$fv_wowPage=Page;module.exports=function(a){var e=a.onPageScroll,b=a.onShow;a.onLoad=function(c){return function(d){"function"==typeof $FV_WXWOW.OnLoadFunc&&$FV_WXWOW.OnLoadFunc.call(this,d);c&&c.call(this,d)}}(a.onLoad);a.onShow=function(c){return function(d){"function"==typeof $FV_WXWOW.OnShowFunc&&$FV_WXWOW.OnShowFunc.call(this,d);c&&c.call(this,d)}}(b);a.onPageScroll=function(c){return function(d){"function"==typeof $FV_WXWOW.OnPageScrollFunc&&$FV_WXWOW.OnPageScrollFunc.call(this,d.scrollTop);c&&c.call(this,d)}}(e);return $fv_wowPage.call(this,a)};
\ No newline at end of file