Javascript 如何防止滚动？（跨浏览器解决方案） 问题

我想阻止元素的实际滚动，但我确实希望滚动条的好处（因此，一些事情不必通过JavaScript编程来完成，而不需要浏览器为我们处理事情）

是否有人对此有更好或改进的解决方案？非常感谢您的帮助

更新13-03-2017 我终于想出了一个答案，这个答案似乎很有效（使用IE11、Edge、Chrome、Firefox、Chrome for Android和Firefox for Android测试）

因此，您可以忽略此问题或问题描述的其余部分

更新12-03-2017 找到了一种在IE 11、Edge、Firefox、Chrome和Android版Firefox之间切换（防止）滚动的方法。虽然它在Chrome for Android中并不是很好（非常落后）。有人知道为什么吗

这是我的解决方案（2017年3月12日）的总结，但Android版Chrome似乎不喜欢它（！）。请帮助改进此解决方案（或者可能有更好的方法不同于此特定解决方案？）

• 一个带有滚动内容的

  div

  ，滚动内容具有

  位置：fixed

  （

  #ScrollsViascrollDistrict

  ，在我的代码中）
• 一个

  div

  ，其高度与滚动内容

  div

  的高度相同，该滚动内容具有

  位置：绝对的
  （或者可能是
  位置：相对的
  ，如果可取）。这是嵌入式代码示例中的
  #ScrollDistrict

• 调用

  window.requestAnimationFrame

  ，使用回调函数调整滚动内容

  div

  的

  marginTop

  值（

  #ScrollsViascrollDistrict

  ）相对于窗口的当前

  scrollTop

  值（使用负边距）
• 然后，为了控制和防止滚动，可以不更新此

  marginTop

  值，使滚动内容

  div

  不受当前滚动条位置的影响

下面测试了IE 11、Edge、Firefox和Chrome（运行正常）以及Chrome for Android（不喜欢）中的代码片段，还测试了Firefox for Android（喜欢）。似乎比使用两个

div

元素和

position:fixed

更好

var scrollDisabled=false；
函数toggleScroll（）{
scrollDisabled=！scrollDisabled；
}
函数doscorl（）{
var-st；
如果（！滚动已禁用）{
$（“#ScrollsViascrollDistrict”）.css（“marginTop”，-$（window.scrollTop（））；
}
window.requestAnimationFrame（doScroll）；
}
window.requestAnimationFrame（doScroll）；
$（“#滚动切换器”）。在（'click'，toggleScroll'）上
正文{
背景色：白烟；
}
#卷轴{
位置：固定；
左：0px；
顶部：0px；
宽度：100%；
}
#滚动分散注意力{
位置：绝对位置；
左：0；
排名：0；
高度：6000px；
}
红色
蓝先生{
位置：相对位置；
宽度：100%；
高度：300px；
}
瑞德先生{
背景色：红色；
}
蓝先生{
背景颜色：蓝色；
}

开始
切换滚动开/关
结束
我现在准备回答我自己的问题

因此，这里有一种切换（防止）滚动的方法：


一个带有滚动内容的
div
，滚动内容具有
位置：fixed
（
#ScrollsViascrollDistrict
，在我的代码中）
一个
div
，其高度与滚动内容
div
的高度相同，该滚动内容具有
位置：绝对的
（或者可能是
位置：相对的
，如果可取）。这是嵌入式代码示例中的
#ScrollDistrict

使用回调函数调用
window.requestAnimationFrame
，该回调函数调整拉具
div
的
marginTop
值（此处称为
#拉具
），它应该是滚动内容
div
（
#ScrollsViascrollDistrict
）与窗口的当前
scrollTop
值相关（使用负边距）。起初我以为我可以直接打开滚动内容本身（更改
的
marginTop
#ScrollsViascrollDistrict
），但这在某些浏览器中不起作用
然后，为了控制和防止滚动，可以不更新此
marginTop
值，使滚动内容
div
不受当前滚动条位置的影响

在IE 11、Edge、Firefox和Chrome中，以及在Chrome for Android和Firefox for Android中测试以下代码片段。似乎比使用两个
div
元素和
position:fixed
更好


$（函数（）{
var=false；
变量$window=$（window）；
函数doscorl（）{
var st=$window.scrollTop（）；
如果（！滚动已禁用）{
控制台日志（st）；
如果（st>6000-$window.innerHeight（））{
$（“#puller”）.css（“marginTop”，-（6000-$window.innerHeight（））；
}否则{
$（“#puller”）.css（“marginTop”，-st）；
}
}
window.requestAnimationFrame（doScroll）；
}
window.requestAnimationFrame（doScroll）；
$（“#scrolltoggler”）。在（'click'，函数（e）上{
scrollDisabled=！scrollDisabled；
});
});
#ScrollsViascroll分散注意力{
位置：固定；
左：0px；
顶部：0px；
宽度：100%；
}
#滚动分散注意力{
位置：绝对位置；
左：0；
排名：0；
宽度：100%；
高度：6000px；
}
#拉拔器{
位置：相对位置；
边际上限：0px；
左：0px；
顶部：0px；
}
红色
蓝先生{
位置：相对位置；
页边顶部：自动！重要；
宽度：100%；
高度：300px；
}
瑞德先生{
背景色：红色；
}
蓝先生{
背景颜色：蓝色；
}

开始
切换滚动开/关
结束
我现在准备回答我自己的问题

所以这里有一个切换的方法(