当我在做一些web开发时,我发现了一些非常奇怪的东西。所以下面JQuery(document).ready在文档准备好之前仍然运行?
是我的jQuery代码
$(document).ready(function() {
$(window).scroll(function() { // check if scroll event happened
if ($(window).scrollTop() > $("#first-content").offset().top * 0.75) {
$(".links").removeClass("white").addClass("black");
to white (#f8f8f8)
} else {
$(".links").removeClass("black").addClass("white");
}
});
});
所以它只是获取从上一段距离触发添加和删除类。必须只有一个点被触发,除非网站的结构动态变化,我认为这在我的代码中是不可能的。
所以问题在于它最终工作正常。当它从窗口顶部通过0.75 *位置到元素顶部时,如果我反过来,字体颜色会从白色变为黑色,再从黑色变为白色。
但我无法弄清楚的是,在我设定的触发点之前只有几个滚动条,还有一点将颜色从白色变为黑色,黑色变为白色每次浏览器重新加载这是不可能的,除非该点很快转移并移回。
如果你尝试自己,这会更容易理解。
https://jsfiddle.net/forJ/q6u1hLoh/1/
必须有只有一个刚刚灰色和白色区域的边界以上变化的点。
但是,您将会看到每次运行代码时,在设定点之前出现JUST ONCE过早的颜色变化点。我认为它必须是导致问题的jQuery,而我粘贴的是我所拥有的唯一jQuery。
请不要随意查看链接中的整个代码,并请告诉我为什么还有另一个触发点。
谢谢
似乎为我工作得很好?可能是缺乏节流,每次你滚动多次时都会发生班级变化。 – adeneo
非常好的效果,除非单独的链接在背景颜色改变时改变颜色,而不是一次改变它们会更好。 – clearlight
这与“文档准备好”有什么关系? – charlietfl