开发H5活动页面阻止页面上下滑动

开发H5活动页面的时候,在微信浏览器中有时候需要禁止页面下拉可以看到顶部显示网页来源,可以用下面这段js

具体代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function isPassive() {
var supportsPassiveOption = false;
try {
addEventListener("test", null, Object.defineProperty({}, 'passive', {
get: function () {
supportsPassiveOption = true;
}
}));
} catch(e) {}
return supportsPassiveOption;
}
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, isPassive() ? {
capture: false,
passive: false
} : false);

小程序中image用户头像从方形变成圆形的问题

开发小程序时有个需求,要让用户的头像显示为圆形,以为很简单,直接让image标签设置border-radius50%,可是当真机预览时发现,头像会先显示为正方形,然后才瞬间变为圆形。

解决办法:

圆形的头像不再使用image组件去做,转而使用view组件,通过背景图片background-image的方式搞上去,问题完美解决!
注意一点:小程序背景图片不能使用本地图片的路径,只能使用https://abc.com/123.jpg这种线上的图片路径