H5页面兼容offsetTop
在制作H5页面时,有些定位的需求,页面中使用一些动画,导致ios与Android在计算特定位置的时候与顶部距离的计算存在偏差,需要做统一配置。
思路:从需要计算的元素,一级级往上寻找,直到最上层元素,然后累加offset高度;
code:
getAllOffsetTop(el,topId) {
let offsetTop = el.offsetTop;
if(el.id==topId){
return 0;
}
if (el.offsetParent) {
offsetTop += getAllOffsetTop(el.offsetParent);
}
return offsetTop;
},
传入需要定位的元素以及顶层元素id即可。
注意点:这里的累加,可能会因为中间出现的margin造成偏差,需要做修复。