最新消息: USBMI致力于为网友们分享Windows、安卓、IOS等主流手机系统相关的资讯以及评测、同时提供相关教程、应用、软件下载等服务。

移动端Web适配单位rem的坑,oppor9手机出现错位bug

IT圈 admin 38浏览 0评论

2023年12月13日发(作者:稽思真)

移动端Web适配单位rem的坑,oppor9手机出现错位bug

我们做了一个抽奖的H5活动页面,被一个oppo R9手机客户反馈,抽奖的转盘错位了.刷新了好几次都不行.网上百度一搜真的有部分安卓手机有

坑.赶紧修复bug.分享完整的代码出来.各位看官自己去核对你们的js是不是和我分享的不一样.请尽快修复bug.免得被祭天吐槽~

//

(function(doc, win) {

var docEl = ntElement,

resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',

recalc = function() {

var clientWidth = Width;

if (!clientWidth) return;

if (clientWidth >= 640) {

ze = '100px';

} else {

ze = 100 * (clientWidth / 750) + 'px';

var div = Element('div');

= '1.4rem';

= '0';

Child(div);

var ideal = 140 * clientWidth / 750;

var rmd = (Width / ideal);

if (rmd > 1.2 || rmd < 0.8) {

ze = 100 * (clientWidth / 750) / rmd + 'px';

}

Child(div);

};

};

if (!ntListener) return;

ntListener(resizeEvt, recalc, false);

ntListener('DOMContentLoaded', recalc, false);

})(document, window);

2023年12月13日发(作者:稽思真)

移动端Web适配单位rem的坑,oppor9手机出现错位bug

我们做了一个抽奖的H5活动页面,被一个oppo R9手机客户反馈,抽奖的转盘错位了.刷新了好几次都不行.网上百度一搜真的有部分安卓手机有

坑.赶紧修复bug.分享完整的代码出来.各位看官自己去核对你们的js是不是和我分享的不一样.请尽快修复bug.免得被祭天吐槽~

//

(function(doc, win) {

var docEl = ntElement,

resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',

recalc = function() {

var clientWidth = Width;

if (!clientWidth) return;

if (clientWidth >= 640) {

ze = '100px';

} else {

ze = 100 * (clientWidth / 750) + 'px';

var div = Element('div');

= '1.4rem';

= '0';

Child(div);

var ideal = 140 * clientWidth / 750;

var rmd = (Width / ideal);

if (rmd > 1.2 || rmd < 0.8) {

ze = 100 * (clientWidth / 750) / rmd + 'px';

}

Child(div);

};

};

if (!ntListener) return;

ntListener(resizeEvt, recalc, false);

ntListener('DOMContentLoaded', recalc, false);

})(document, window);

发布评论

评论列表 (0)

  1. 暂无评论