时间:2021-05-18
微信小程序开发图片拖拽实例详解
1.编写页面结构:moveimg.wxml
2.编写页面样式:moveimg.wxss
3.设置数据:moveimg.js
var app = getApp() Page({ data: { ballleft:-20, screenWidth: 0, }, onLoad: function() { var _this = this; wx.getSystemInfo({ success: function(res) { _this.setData({ screenHeight: res.windowHeight, screenWidth: res.windowWidth, }); } }); }, ballMoveEvent: function(e) { var touchs = e.touches[0]; var pageX = touchs.pageX; console.log('宽度 '+this.data.screenWidth) console.log('pageX: ' + pageX); //这里用right和bottom.所以需要将pageX pageY转换 var x = this.data.screenWidth/2 - pageX-20; if(this.data.screenWidth>385){ if(x>42){x=42;} }else{ if(x>32){x=32;} } if(x<0){x=0;} console.log('x:' + x) this.setData({ ballleft: -x }); } })这几天一直在研究图片裁剪,思路是有,可是却遇到各种问题。可怜编程不易啊。
想了好久,决定还是简单开始吧。如果大家有更好的方式或是其他想法,欢迎提出,一起讨论。
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
微信小程序开发MAP(地图)实例详解在创建MAP(地图)前,请各位小伙伴们认真的去了解微信小程序开发的说明。https://mp.weixin.qq.com/d
微信小程序图片自适应支持多图实例详解微信小程序图片自适应,是一个比较常见的需求,平时我们在WEBView中,只需要设置max-width:100%.在微信里面虽
微信小程序Mustache语法详解最近微信小程序非常火,对于前端开发的程序员是个利好的消息,这里主要记录下微信小程序Mustache语法。小程序开发的wxml里
微信小程序-getUserInfo回调的实例详解前言:这里就不吹嘘微信小程序有多厉害了,毕竟也不是我写的,直接谈谈我在做小程序开发时遇到的奇异Bug。getUs
微信小程序后台解密用户数据实例详解微信小程序API文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-lo