微信小程序頂部上下輪播公告的兩種實(shí)現(xiàn)

第一種swiper組件,沒(méi)什么可說(shuō)的
第二種使用動(dòng)畫(huà)

playNoticeAnimation: function (t) {
    // 獲取一堆數(shù)據(jù),隨機(jī)展示
    var randomInfo = ['小蘋(píng)果 提現(xiàn)1元現(xiàn)金', '隨遇而安 提現(xiàn)5元現(xiàn)金', '阿濤 提現(xiàn)1元現(xiàn)金', '小龍女 提現(xiàn)10元現(xiàn)金', 'ye zhe tian 提現(xiàn)20元現(xiàn)金', '王大春 提現(xiàn)3元現(xiàn)金', '三生三世 提現(xiàn)5元現(xiàn)金'];
    var len = randomInfo.length;
    setInterval(function () {
      i++;
      if (i >= len) {
        i = 0;
      }
      !that.animation && (that.animation = wx.createAnimation());
      var e = that.animation;
      e.translateY("-150%").step({
        duration: 300,
        timingFunction: "ease-in"
      }), e.opacity(0).translateY("150%").step({
        duration: 1,
        timingFunction: "step-start"
      }), e.opacity(1).translateY(0).step({
        duration: 300,
        timingFunction: "ease-out"
      }), that.setData({
        noticeAnimation: e.export()
      }), t && setTimeout(t, 300);
      setTimeout(function(){
        that.setData({
          random_gg: randomInfo[i]
        })
      },300)

    }, 3000)
  },
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 在iOS中隨處都可以看到絢麗的動(dòng)畫(huà)效果,實(shí)現(xiàn)這些動(dòng)畫(huà)的過(guò)程并不復(fù)雜,今天將帶大家一窺iOS動(dòng)畫(huà)全貌。在這里你可以看...
    F麥子閱讀 5,271評(píng)論 5 13
  • 在光芒萬(wàn)丈之前,我們都要欣然接受眼下的難堪和不易,接受一個(gè)人的孤獨(dú)和偶爾的無(wú)助。 ??? 2018.3.7 ...
    景小禪閱讀 602評(píng)論 5 2
  • 今天晚上開(kāi)年會(huì),2018過(guò)去了,2019才剛剛開(kāi)始,改變自我,做好新一年的自己
    cac47ec5e164閱讀 146評(píng)論 0 0
  • 1每天晚上快走一個(gè)小時(shí) 2每天呼啦圈四十分鐘,堅(jiān)持一個(gè)多月,瘦腰明顯不反彈 3早上喝鹽水晚上喝蜂蜜水(避免第二天浮...
    阿魯2閱讀 2,051評(píng)論 0 1

友情鏈接更多精彩內(nèi)容