![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
文章平均质量分 76
Archimelan
路漫漫其修远兮,吾将上下求索。
展开
-
小程序实现【自动滚动信息栏】
需求:列表不断获取最新信息,加入列表并自动滚动到底部效果如下:关键:利用scroll-view控件,控制scroll-top达到自动滚动的效果wxml:<view class="section"> <view class="section__title">vertical scroll</view> <scroll-view scroll-y st...原创 2018-05-14 11:10:06 · 3624 阅读 · 0 评论 -
小程序js实现【数字变化动画效果】
需求:由一个数字变化到另一个数字,中间有类似摇奖、生成随机数那样的动画视觉效果效果:思路:把两个数的差值分成几次变化wxml:new Number: {{newNumber}}<view>{{number}}</view><button bindtap="start">start</button>js:var thatPage({ dat...原创 2018-05-14 14:36:15 · 10122 阅读 · 0 评论 -
小程序实现【滑动齿轮数字选择器】
效果:关键:用小程序picker-view实现,linear-gradient实现背景渐变色wxml:<view> <view>{{arr1Value}}{{arr2Value}}{{arr3Value}}{{arr4Value}}{{arr5Value}}{{arr6Value}}{{arr7Value}}{{arr8Value}}{{arr9Value}}</...原创 2018-05-14 17:41:52 · 3444 阅读 · 2 评论 -
小程序实现【倒计时计时器,最后十秒只显示一位数并且加入放大动画效果】
效果:js:var that// 用来实现最后十秒强调的动画var animation = wx.createAnimation({ duration: 300, timingFunction: 'ease',})/** * [倒计时函数,最后十秒只显示一个数字,且有放大动画效果] * @param {Number} minutes [分钟] * @pa...原创 2018-05-15 14:31:27 · 4174 阅读 · 3 评论 -
小程序js实现【滚动文字广播、动态滚动公告栏】动画效果
效果:实现思路:内容是同一个容器,通过动画的效果以及改变容器的内容达到以上效果wxml:<view style="height: 30px;overflow: hidden;"> <view animation="{{animationData}}">{{content}}</view></view>js:var thatvar anima...原创 2018-05-15 16:40:49 · 9454 阅读 · 1 评论