红包打开的效果是:点击红包,红包打开,红包中的黄色卡片移出。
(1) 在页面某处插入元素“定时器”,设置属性,时间间隔-2250、总循环次数-1、起始循环次数-0、定时器状态-关闭、触发自定义事件-interval1.ww,如下图:
(2) 需要三张图,初始图hb1.png,打开的动图hb2.gif,最终图hb3.png。重新拖入一个布局,在编辑页面里先放两张图片hb1.png和hb3.png,设置hb1.png显示,id为hongbao1;hb3.png隐藏,id为hongbao3;给hb1.png数据绑定,绑定模式为“属性绑定”,绑定参数:{"src":hongbao},绑定变量初始化:{"hongbao":"/img/hb1.png"}(给图片赋初始值)。
(3) 给hb1.png设置逻辑,单击当前元素,额外逻辑选“绑定数据编程”,填入:var a = [{"intervalName1":"start"}]; _vm.intervalcontrol(JSON.stringify(a));(目的是设置打开定时器),_vm.hongbao("/img/hb2.gif");(目的是将图片hb1.png切换为hb2.gif )
(4) 给定时器设置逻辑当前元素-其他事件-额外参数endinterval1.ww,额外逻辑-绑定数据编程 $("#hongbao1").addClass("hide");(目的是隐藏hb1.png) $("#hongbao3").removeClass("hide"); (目的是显示hb3.png)