设为首页收藏本站

小程序开发|小程序制作|小程序开发网

搜索
小程序开发|小程序制作|小程序开发网 › 小程序开发 ›小程序开发经验 › 查看内容

微信小程序学习用demo：优惠猎手（红包）；简易图片动画

2022-6-25 17:13| 发布者: 牛摩的| 查看: 244| 评论: 9

摘要: var app = getApp();Page({  data: {    userInfo: {},    src: '',    coverImg:{      hidden: false,      top: 0, //上面图



  1. var app = getApp();
  2. Page({
  3.   data: {
  4.     userInfo: {},
  5.     src: '',
  6.     coverImg:{
  7.       hidden: false,
  8.       top: 0, //上面图片的top值
  9.       bottom: 0, //下面图片的bottom值
  10.       locked: false //首页展开触摸锁定
  11.     },
  12.     openPage: app.globalData.openPage==1?true:false
  13.   },
  14.   resetCoverImg: function() {
  15.     this.setData({
  16.       coverImg:{
  17.         hidden: false,
  18.         top: '0',
  19.         bottom: '0'
  20.       }
  21.     })
  22.   },
  23.   bindOpenTap: function () {
  24.     var that = this;
  25.     if(!that.data.coverImg.locked){
  26.       that.setData({coverImg:{locked: true}});
  27.       var dis = 0;
  28.       var timer = setInterval(function(){
  29.           dis -= 1;
  30.           that.setData({
  31.             coverImg:{
  32.               top: dis+'%',
  33.               bottom: dis+'%'
  34.             }
  35.           })
  36.         },10);
  37.         setTimeout(function(){
  38.           clearInterval(timer);
  39.           //展开首页图
  40.           that.setData({
  41.             coverImg:{
  42.               hidden: true,
  43.               locked: false
  44.             }
  45.           })
  46.           //未展示开屏页直接跳转
  47.           if(that.data.openPage){
  48.             that.goToOpenPage();
  49.           }else{
  50.             that.goToListPage();
  51.           }
  52.         },500);
  53.     }
  54.   },
  55.   goToListPage: function() {
  56.     wx.navigateTo({
  57.       url: '../list/list'
  58.     })
  59.   },
  60.   goToOpenPage: function() {
  61.     wx.navigateTo({
  62.       url: '../open/open'
  63.     })
  64.   },
  65.   //分享
  66.   onShareAppMessage: function() {
  67.       app.updateUserInfo({'type':0});
  68.       return {
  69.           title: '优惠猎手PRO',
  70.           desc: '优惠猎手PRO',
  71.           path: 'pages/index/index'
  72.       }
  73.   },
  74.   onShow: function() {
  75.       this.resetCoverImg();
  76.   }
  77. })
下载地址：


免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

鲜花
握手
雷人
路过
鸡蛋
收藏 分享 邀请
上一篇：微信小程序开发过程中需要注意哪些问题？下一篇：【微信小程序开发教程】外卖小程序开发
发表评论

最新评论

引用 快乐的鱼 2022-6-25 18:21
102410241024102410241024102410241024
引用 梅西 2022-6-25 18:10
学习学习
引用 admin 2022-6-25 18:05
可以可以看看
引用 admin 2022-6-25 18:01
看看 学习学习
引用 心影大都 2022-6-25 17:53
学习学习
引用 北极圈的瓜 2022-6-25 17:43
请问代码可以下载吗
引用 xiaoxiao 2022-6-25 17:37
看看学习了
引用 牛摩的 2022-6-25 17:32
这是好东西啊
引用 心影大都 2022-6-25 17:26
200多套微信小程序源码带后台+教程+源码

查看全部评论(9)

相关分类

返回顶部