根据各位大佬的解决方案,成功解决苹果13Picker选择器异常问题,下面是解决过程。
问题1描述:
商城添加收货地址时,3级联动选择地址,安卓手机显示,下滑都正常。但是苹果13 16.2版本以上下滑异常,下滑地址时出现跳动,选不中现象。
问题1解决:
分别在mui.picker.js 和 mui.picker.all.js 添加下面代码,判断IOS16.2以上版本webkitTransformOrigin样式不生效。
if (isIos) {
if(mui.os.ios && mui.os.plus && plus.os.version >= '16.2'){
return;
}
var maches = userAgent.match(/iphone os ([\d_]+) /i);
if(maches && maches.length >= 2 && maches[1] >= '16_2'){
return;
}
self.list.style.webkitTransformOrigin = "center center " + self.r + "px";
}
问题2描述:在在mui.picker.js 和 mui.picker.all.js 添加上面代码后,发现选择正常了,但是选项被遮挡,如下:
问题2解决:
进入mui.picker.all.css文件,注释掉下面两行样式代码:
.mui-picker-inner {
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
/* -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent); */
/* -webkit-mask-box-image: linear-gradient(top, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent); */
}
添加:
.mui-ios-16.mui-ios-16-2 .mui-pciker-list{
-webkit-transform-origin-x:0 !important;
}
经过测试,添加地址恢复正常,非常顺溜。
再次感谢各位爱分享的大佬们,成功解决过程分享给大家,希望有所帮助!
精彩内容
发表评论