Html 滚动固定高度div时隐藏/显示div

我正在创建一个带有文本框的基于PHP的站点。通常文本字段会溢出，因此我使用自动y形溢出将其设置为固定高度

为了在可见空间下方显示更多文本，我想淡出文本的底部。有很多方法可以做到这一点。我想要的方法是在文本顶部添加一个div标记，其中包含一个背景图像的副本，该副本会逐渐变为透明。问题是当你点击滚动的底部时，我希望这个div标签隐藏，然后在向上滚动时再次显示，反过来，在向下滚动时在显示的顶部显示一个隐藏的div，然后在返回页面顶部时隐藏

我已经改编了一个JSFIDLE，但是没有太多的外观。你知道我错过了什么吗

原始js在这里

我的改编版本在这里

我的淡出一直在工作，直到我试图调整卷轴，使其基于内容div中的卷轴，而不是整个主体

---

如果您将滚动条附加到内容div，您会感激任何帮助吗

这样做：

$('.content').scroll(function () {

与此相反：

$(document).scroll(function () {

---

我不知道我是否完全理解你的问题，但听起来你想要这样的想法：

$('.content').scroll(function () {

而不是

$(document).scroll(function () {

既然你想知道用户在你的元素上滚动了多远，而不是在整个页面上，你想知道吗

更新您的

$(document).scroll(function () {