用setInterval方法实现弹框闪烁

Michael_Lin 发布于2019-08-02 10:42 / 342人阅读

每次看到某电商平台的拼团提示会觉得很有趣也很方便，正好自己在学习小程序，那就想个法子实现一下这种效果咯~

思虑了一下还是觉得用setIntercal方法比较简便（数据方面就先不考虑了，我这里只做一下表现效果），基本思路是通过定时来控制拼团提示出现和隐藏；即隔一定时间就将data中传给wx:if里的数据取反（布尔值）；写完后我认真的去比对了一下，为什么同样都是闪烁，我的怎么越看越别扭？？....

上图上图[紧张脸]

代码：

wxml

    
        
            
                
            
            Lesta邀请您一起剁手

    //data中，默认拼团提示显示
    data: {
        show: true,
    }
    
    .......
    //在onLoad函数里调用setInterval方法
    onLoad: function() {
        var that = this;
        //动画
        var animation = wx.createAnimation();
        //计时，每1.5秒弹出一次
        setInterval(function () {
            //取反控制显示和隐藏
            var show = !that.data.show;
            that.setData({
                animationData: animation.export(),
                show: show
            })
        }, 1500)
    }

大概就是这样吧，很简单的一个小方法，对setInterval有疑问的小伙伴可以去看看参考手册噢。

附：我的github地址

我的小项目地址

谢谢各位小伙伴~

服务器托管私有云 java实现点击弹框 html实现弹框界面关于页面弹框功能实现 setInterval

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/52528.html

用setInterval方法实现弹框闪烁

每次看到某电商平台的拼团提示会觉得很有趣也很方便，正好自己在学习小程序，那就想个法子实现一下这种效果咯~思虑了一下还是觉得用setIntercal方法比较简便（数据方面就先不考虑了，我这里只做一下表现效果），基本思路是通过定时来控制拼团提示出现和隐藏；即隔一定时间就将data中传给wx:if里的数据取反（布尔值）；写完后我认真的去比对了一下，为什么同样都是闪烁，我的怎么越看越别扭？？....上图上...

sumory 2019-08-22 17:59 评论0 收藏0
JS实现浏览器的title闪烁、滚动、声音提示、通知

摘要：通知实现浏览器的闪烁滚动声音提示等系统通知。先这是重复造轮子，标题闪烁或者滚动提示，数字显示。声音设置播放声音自动播放声音停止播放声音设置播放声音设置一个设置多个通知最新的版本默认不播放标题闪烁动画，初始化之后需要调用方法才播放标题动画。通知 showImg(https://img.shields.io/github/issues/jaywcjlove/iNotify.svg); s...

SillyMonkey 2019-08-21 10:30 评论0 收藏0
618购物节来袭，电商陪你浪浪浪

摘要：导航栏导航栏用的组件，设置其水平方向滑动，点击到的字体会变换样式。而且，导航栏点击不同的类别会将主页替换成不同的结构，这就要将最开始的主页结构隐藏起来。前言购物节又要来啦！！（撒花撒花！）零食打折啦！！衣服打折了！！小伙伴们准备好买买买了吗！！！让我看看我还多少余额哈！（满心期待(*￣︶￣)）（10秒后......）好吧我还是写个电商小程序过过瘾好了。[冷漠脸]咳咳，让我们进入正题...

selfimpr 2019-08-29 15:42 评论0 收藏0
618购物节来袭，电商陪你浪浪浪

摘要：导航栏导航栏用的组件，设置其水平方向滑动，点击到的字体会变换样式。而且，导航栏点击不同的类别会将主页替换成不同的结构，这就要将最开始的主页结构隐藏起来。前言购物节又要来啦！！（撒花撒花！）零食打折啦！！衣服打折了！！小伙伴们准备好买买买了吗！！！让我看看我还多少余额哈！（满心期待(*￣︶￣)）（10秒后......）好吧我还是写个电商小程序过过瘾好了。[冷漠脸]咳咳，让我们进入正题...

hellowoody 2019-08-22 18:00 评论0 收藏0
618购物节来袭，电商陪你浪浪浪

摘要：导航栏导航栏用的组件，设置其水平方向滑动，点击到的字体会变换样式。而且，导航栏点击不同的类别会将主页替换成不同的结构，这就要将最开始的主页结构隐藏起来。前言购物节又要来啦！！（撒花撒花！）零食打折啦！！衣服打折了！！小伙伴们准备好买买买了吗！！！让我看看我还多少余额哈！（满心期待(*￣︶￣)）（10秒后......）好吧我还是写个电商小程序过过瘾好了。[冷漠脸]咳咳，让我们进入正题...

MarvinZhang 2019-08-02 10:41 评论0 收藏0