微信小程序下拉按钮动画

有些时候要求下拉按钮需要动画效果,但又不需要引入插件.

这时需要手动写一个动画.

主要思路:

  动态切换class

  默认与动画转向的样式编写

微信小程序下拉按钮动画

上图是默认给出的按钮向下的样式,

微信小程序下拉按钮动画

上图是动画转向后的样式

微信小程序下拉按钮动画

上图声明动画执行动作

在page实例data对象中声明一个变量,默认给true

微信小程序下拉按钮动画

然后给图片加个点击事件

微信小程序下拉按钮动画

这样一来就达到动态切换class的动画效果啦

微信小程序下拉按钮动画

上一篇:js判断是否在微信浏览器中打开


下一篇:【UML 建模】UML建模语言入门-视图,事物,关系,通用机制(三)