小猿圈web前端之微信小程序实现点击效果
最近小程序越来越好，而且前景和薪资也是越来越高，而且小程序实现点击效果，具有一定的价值，今天小猿圈web前端讲师今天给大家讲微信小程序实现点击效果的，正在学习web前端的小伙伴不要错过呦。微信小程序动画之点击效果的具体代码，供大家参考，具体内容如下https://upload-images.jianshu.io/upload_images/15397392-88909f7ad333c100.gif?imageMogr2/auto-orient/strip代码：js：// pages/test/test.jsPage({containerTap: function (res) {var that = thisvar x = res.touches.pageX;var y = res.touches.pageY + 85;this.setData({rippleStyle: ''});setTimeout(function () {that.setData({ rippleStyle: 'top:' + y + 'px;left:' + x + 'px;-webkit-animation: ripple 0.4s linear;animation:ripple 0.4s linear;'});}, 200)},})wxml：<view class="ripple" style="{{rippleStyle}}"></view><view class="container" bindtouchstart="containerTap"></view>wxss：page{height:100%}.container{width:100%;height:100%;overflow: hidden}.ripple {background-color:aquamarine;border-radius: 100%;height:10px;width:10px;margin-top: -90px;position: absolute;
overflow: hidden}@-webkit-keyframes ripple {100% {webkit-transform: scale(12);transform: scale(12);background-color: transparent;}}以上就是小猿圈web前端老师讲的微信小程序实现点击效果，想要学习前端知识可以观看我的文章，相信不会让你失望的web前端自学②群：738735873，学习前端可以到小猿圈网站去看一下最新最全面的前端课程，希望对大家的学习有所帮助。
页:
[1]