IOS端h5 fixed滚动问题 🔗
1
2
3
4
5
6
|
visualViewport.addEventListener("resize", resizeHandler);
const resizeHandler = () => {
// ...
}
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| // 需要针对 iOS 越界弹性滚动的情况进行边界检查
styles.left = Math.max(0, Math.min(
document.documentElement.scrollWidth - visualViewport.width,
visualViewport.offsetLeft
)) + 'px';
// 需要针对 iOS 越界弹性滚动的情况进行边界检查
styles.top = Math.max(0, Math.min(
document.documentElement.scrollHeight - visualViewport.height,
visualViewport.offsetTop
)) + 'px';
styles.width = visualViewport.width + 'px';
styles.height = visualViewport.height + 'px';
|
Reference 🔗
https://tkte.ch/articles/2019/09/23/iOS-VisualViewport.html
MDN VisualViewport
http://www.alloyteam.com/2020/02/14265/