脚本不考虑锚点位置

Question

当您在模式中向下滚动时，脚本会更改div的背景颜色。我有一个锚点，但脚本会激活背景颜色变化，就好像锚点是top:0;一样。它不喜欢top:30%;。

#anchor-point { top: 30%; position:absolute; }

https://jsfiddle.net/qhrmtass/4/

Answer 1

你的CSS是对的。 什么不是你的JS：

你宣布

var targetOffset = $("#anchor-point").offset().top;

在脚本的开头，当$（＆＃39;＃anchor-point＆＃39;）尚未显示时。因此，浏览器认为其偏移量为0。

如果您等待显示元素以获得其偏移量，那么它可以正常工作。

在您的情况下，一个非常简单的修复不是使用临时变量，而是在需要时进行计算：

if ($('.remodal').scrollTop() > $("#anchor-point").offset().top) {

看看这里：https://jsfiddle.net/qhrmtass/5/