html,body{
position: fixed;
top:0;
left:0;
height: 100vh;
overflow: scroll;
}
实现方式超级简单,但是我调了好多次都没有实现效果,研究了半天发现是页面缓存的问题,于是在head标签内加载css文件的时候改成了以下写法
<link type="text/css" rel="stylesheet" href="css/page.css?t=<?=filemtime("css/style.css")?>">
====================================
2020年6月28日 16:03:03 修改
上面的做法或许是可以实现的,但是在某些情况下导致业务内的滑动也失效。今天又研究了一套做法就是。
.bg {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
overflow: auto;
background-color: #fff;
}
<script type="text/javascript">
setInterval(function () {
$(".bg").focus();
console.log(1);
}, 500);
</script>
解释一下,我理解的应该也不是完全正确的 就是 css样式可以实现想要的效果,但是偶尔页面上需要滑动的dom会失焦,导致无法滑动,此时可以用js定时器给这个dom元素获取焦点。