哦哈！
我正在尝试为我网站上的菜单添加一点效果。这是我要创建的事件：
1- 用户加载页面：菜单距离页面顶部 36 像素；
2-用户开始向下滚动阅读内容；
3-当用户滚动了 36px 时，菜单移动到页面的最顶部并停留在那里；
4-用户继续向下滚动，菜单仍然固定在最顶部；
5-用户向上滚动直到到达顶部不到 36px，菜单回到他的第一个位置，距离顶部 36px。
这很有趣，我刚刚注意到 Stack Overflow 正在使用一些代码来完成与我在编写新问题时页面右侧的“类似问题”框完全相同的操作。如果你想有一个概述，只需开始创建一个新问题并观看它。我试图找出他们正在使用什么，但失败了。
为了达到我的效果，我使用了与该scrollTop()属性关联的 jQuery 属性scroll()。这是代码：
$(document).scroll(function() {
if ($(document).scrollTop() >= 36) {
$('#menu').css({'top': '0px'});
} else {
$('#menu').css({'top': '36px'});
}
});
这适用于document，这意味着页面的整个正文。
现在的问题是我想在article具有该overflow-y :scroll属性的元素中使用它。当我谈论<article>元素时，我指的是 HTML5 文档中使用的元素（例如<nav>, <aside>, <section>, <footer>...）。
结果，JQ 没有在 中找到任何滚动，document这是真的，因为现在，整个页面中唯一的滚动在article元素内部。身体从不移动，这是故意的。
所以我尝试了这个：
$('article').scroll(function() {
if ($('article').scrollTop() >= 36) {
$('#menu').css({'top': '0px'});
} else {
$('#menu').css({'top': '36px'});
}
});
还有这个：
$(document).scroll(function() {
if ($(document).scrollTop() >= 36) {
$('#menu').css({'top': '0px'});
} else {
$('#menu').css({'top': '36px'});
}
});
甚至这样：
$('#insidecontent').scroll(function() {
if ($('#insidecontent').scrollTop() >= 36) {
$('#menu').css({'top': '0px'});
} else {
$('#menu').css({'top': '36px'});
}
});
#insidecontent是元素后面的名称，div稍后article您将在 Jsfiddle.net 为您提供的代码中看到。
这是行不通的。不是因为article元素，我正在使用另一个 jQuery 代码来动态调整高度，这也article没有任何问题。我试过没有它。
http://jsfiddle.net/fKkML/1/
在这里你
可以找到带有第一个版本$(document)（它正在工作，只需在“结果”框中滚动即可。overflow-y: scroll
http://jsfiddle.net/BCuez/7/
这里是overflow-y: scroll打开 和的版本$('article')，这是不工作的。
注意：在第二个链接中，溢出由 Jsfiddle.net 以相同的方式处理，似乎这是滚动的整个身体。但正如你所看到的，效果还是被搞砸了。您可以通过创建文件在本地计算机上尝试此代码，您会看到。
注意 2：我必须在这些演示中添加一个margin-top: 70pxto article，但在真实和整个代码中不需要它。
Note3：我是 HTML5/CSS3 的“专业”用户，但不是jQuery，这是我第一次在 Web 的帮助下编写自己的 JQ 代码。我是这个主题的菜鸟，所以如果你能详细说明你的答案以帮助我正确理解它，我真的很感谢你。
在发布此内容之前，我已在此处搜索答案。例如，我发现这个主题与我的有点相关，但不是真的。我没有找到任何真正可以帮助我或与我真正相同的东西。
非常感谢您给我的帮助。我对获得相同结果的其他方法持开放态度，但这种方法似乎非常接近工作。