当用户改变滚动方向时，我想显示没有位置突然变化的手机网站。
当移动设备的用户向下和向上滚动时，会出现问题。然后由于浏览器显示菜单而改变视图的高度。结果用户即时看到之前网站的其他片段。
我提供了代码示例：
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale = 1.0, user-scalable=no">
<style>
p { padding-top: 6vh; }
</style>
</head>
<body>
<!-- some paragraphs -->
<section>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi egestas ornare risus a efficitur. Nulla laoreet sagittis magna sed facilisis.</p>
<p> Aliquam nec enim porta, condimentum nibh et, posuere sapien. Sed id consectetur erat. Cras malesuada turpis ut iaculis feugiat. </p>
...
<p>Donec ac enim hendrerit, placerat leo aliquam, mollis mauris. Proin vitae purus ligula. Ut lectus arcu, ullamcorper et feugiat ut, feugiat ut orci. </p>
<p>Phasellus augue eros, vestibulum pharetra tempus id, tristique ullamcorper urna. Donec sed augue commodo, placerat quam a, scelerisque dui.</p>
</section>
</body>
</html>
小提琴：
带有元标记的版本，可在移动浏览器上进行测试：
失败的解决方案列表：
viewport-units-buggyfill - 克隆存储库并在底部菜单显示时启动示例vh更改。heigth: -webkit-calc(100% - 0px); - 它在移动设备上运行相当不错，但在计算机工作中完全不同于vh jQuery - second source - 在这个方法中，我必须找到任何使用vh单位的高度元素来源：
是否有任何方法可以在移动设备上应用优秀的vh而不出现这样的问题？
答案 0 :(得分：0)
最后，我使用jQuery来修复vh单元，就像在源代码2和那里提到的一样。
CSS: Are view height (vh) and view width (vw) units widely supported?