微信小程序滾動動畫,微信小程序全屏動畫滾動
2020-09-27
導讀：本帖最后由 ewos 于 2017-4-26 15:12 編輯 微信小程序全屏動畫滾動 GIF.gif (117.81 KB, 下載次數: 11) 下載附件 保存到相冊 2017-4-26 15:10 上傳 Page({ data: { scrollindex:0,//當前頁面的索引值 totalnum:5,/...
微信小程序全屏動畫滾動
- Page({
- data: {
- scrollindex:0, //當前頁面的索引值
- totalnum:5, //總共頁面數
- starty:0, //開始的位置x
- endy:0, //結束的位置y
- critical: 100, //觸發翻頁的臨界值
- margintop:0, //滑動下拉距離
- },
- onLoad: function () {
- },
- scrollTouchstart:function(e){
- let py = e.touches[0].pageY;
- this.setData({
- starty: py
- })
- },
- scrollTouchmove:function(e){
- let py = e.touches[0].pageY;
- let d = this.data;
- this.setData({
- endy: py,
- })
- if(py-d.starty<100 && py-d.starty>-100){
- this.setData({
- margintop: py - d.starty
- })
- }
- },
- scrollTouchend:function(e){
- let d = this.data;
- if(d.endy-d.starty >100 && d.scrollindex>0){
- this.setData({
- scrollindex: d.scrollindex-1
- })
- }else if(d.endy-d.starty <-100 && d.scrollindex<this.data.totalnum-1){
- this.setData({
- scrollindex: d.scrollindex+1
- })
- }
- this.setData({
- starty:0,
- endy:0,
- margintop:0
- })
- },
- })
第二部分：如何開通一個小商店
您可能感興趣:
掃碼免費領取運營資料包
