首页 > 其他 > 详细

小程序开发 模态弹出框的控制

时间:2017-10-08 10:57:54      阅读:351      评论:0      收藏:0      [点我收藏+]
// 模态框控制弹出按钮
<view class=‘btn-right-btn flexca‘ bindtap="setModalStatus" data-status="1">立即抢拼</view>
 
//模态弹出框外包裹
<view class=‘add-rob‘ bindtap="setModalStatus" data-status="0" wx:if="{{showModalStatus}}">
 
JS函数 
//-----------------------------------------
// 弹窗
setModalStatus: function (e) {
var animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})

this.animation = animation
animation.translateY(300).step();

this.setData({
animationData: animation.export()
})

if (e.currentTarget.dataset.status == 1) {

this.setData(
{
showModalStatus: true
}
);
}
setTimeout(function () {
animation.translateY(0).step()
this.setData({
animationData: animation
})
if (e.currentTarget.dataset.status == 0) {
this.setData(
{
showModalStatus: false
}
);
}
}.bind(this), 200)
},

小程序开发 模态弹出框的控制

原文:http://www.cnblogs.com/dianzan/p/7636629.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!