Javascript 微捕捉到锚定点

当这个锚几乎处于正确的位置时，我试图将一个滚动条捕捉到锚上。我这么说是因为我不想让所有的脚本在我离锚还很远的时候直接把我带到锚。我不想让用户失去对滚动的控制，除非它快到了。我只想在用户屏幕上完美地安装一个div

例如，如果我的定位点位于页面的第2000个像素上，则当滚动在1990px和2010px之间时，我希望它捕捉到2000px。如果没有，它不应该捕捉，并且应该在用户手动向上或向下滚动页面时做出反应

你们有什么脚本/解决方案吗？如果只使用CSS处理它会更好，但是如果需要js也可以

谢谢

允许您这样做的CSS规则。您可以在此处看到一个示例：。加载的库是可选的。polyfill将使其在旧版本的IE上工作

---

另一方面，如果您想要一个更简单的解决方案，您可以实现自己的算法。分解流程我们需要的是：

检测用户何时停止滚动

若用户已停止滚动，则检查我们是否靠近锚

如果我们靠近一个锚，那么抓住它

这可以做到：

const snapAt=1000
常数snapRange=50
//设置IsCrolling变量
变异系数；
//收听滚动事件
window.addEventListener（'scroll'，函数（事件）{
log（“当前滚动为：”，window.scrollY）
//在整个滚动过程中清除超时
窗口清除超时（IsCrolling）；
//设置在滚动结束后运行的超时
isScrolling=setTimeout（函数（）{
//运行回调
log（“滚动已停止在：”，window.scrollY）；
如果（window.scrollY>=（snapAt-snapRange）&&window.scrollY允许您这样做的CSS规则。您可以在此处看到一个示例：。加载的库是可选的。polyfill将使其在旧版本的IE上工作


另一方面，如果你想要一个更简单的解决方案，你可以实现你自己的算法。分解过程，我们需要的是：

检测用户何时停止滚动
若用户已停止滚动，则检查我们是否靠近锚
如果我们靠近一个锚，那么抓住它
这可以做到：


const snapAt=1000
常数snapRange=50
//设置IsCrolling变量
变异系数；
//收听滚动事件
window.addEventListener（'scroll'，函数（事件）{
log（“当前滚动为：”，window.scrollY）
//在整个滚动过程中清除超时
窗口清除超时（IsCrolling）；
//设置在滚动结束后运行的超时
isScrolling=setTimeout（函数（）{
//运行回调
log（“滚动已停止在：”，window.scrollY）；
如果（window.scrollY>=（snapAt-snapRange）&&window.scrollY，我为可见性添加了标记。我为可见性添加了标记。