Javascript 更改滚动页边距顶部（动画）

多亏了用户Rex，我现在使用下面的代码更改带有动画效果的滚动页边距

$(document).scroll(function () {
$("#content").animate({margin: "0px 0px 0px 0px"}, 3000);
});

现在，我想在向上滚动时获得相同的效果，即边距返回到其原始状态，我尝试使用以下脚本检测向上或向下滚动，但不起作用：（警告消息帮助我显示滚动检测脚本是否起作用）

希望有人能帮助我

解决方案：

编辑：

这个答案指的是这个JSFIDLE：

结束编辑。

在JSFIDLE中，您正在为窗口的滚动事件注册一个处理程序，上面写着“当窗口滚动时，为文档滚动事件注册一个处理程序”，这会把一切都搞砸。您的代码如下所示：

$(document).scroll(function () {
  $("#three").animate({margin: "0px 0px 0px 0px"}, 3000);
});

$("#three").animate({margin: "0px 0px 0px 0px"}, {queue: false, duration: 3000});

应该是这样的：

$("#three").animate({margin: "0px 0px 0px 0px"}, 3000);

基本上只需删除文档滚动包装器

然后，还有第二个问题，jQuery会自动为您将这些动画排队，以便在您滚动时它们会被延迟。您将通过以下方式获得更好的结果：

$(document).scroll(function () {
  $("#three").animate({margin: "0px 0px 0px 0px"}, 3000);
});

$("#three").animate({margin: "0px 0px 0px 0px"}, {queue: false, duration: 3000});

在你的小提琴上做些改变，看看你得到了什么