Jquery 在FlexBox中使用ScrollTop不起作用

导航，主，页脚，有3个标签。我将其应用于FlexBox：

body {
  color: #ddd;
  font-family: Gotham;
  background: url(../assets/body-background.png);
  display: flex;
  min-height: 100%;
  flex-direction: column;
}
main {
  flex: 1;
}

一切看起来都很好。但在那之后情况变得更糟了

我的脚本文件中有以下代码（使用jQuery）：

但是页面滚动动画不起作用

$（'a'）。单击（函数（）{
$（'body'）。设置动画({
滚动顶部：0
}, 1000);
})

nav{
填充：10px；
背景：灰色；
}
主要{
高度：800px；
背景：浅灰色；
}
页脚{
填充：10px；
背景：灰色；
}
身体{
显示器：flex；
最小高度：100vh；
弯曲方向：立柱；
}
主要{
弹性：1；
}
a{
位置：固定；
右：40px；
底部：40px；
}

导航内容
主要内容
页脚内容在Chrome中运行良好，但在Firefox中不起作用。要在Firefox中使用滚动，必须在
html
上使用滚动条：

$('body,html').animate({
  scrollTop: 0
}, 1000);

另外，
main
不会接受您在Firefox中分配给它的800px。对于跨浏览器的相同行为，将
flex:1
更改为
flex:1 800px

请参见下面的演示：


$（'a'）。单击（函数（）{
$（'body，html'）。设置动画({
滚动顶部：0
}, 1000);
})
nav{
填充：10px；
背景：灰色；
}
主要{
高度：800px；
背景：浅灰色；
}
页脚{
填充：10px；
背景：灰色；
}
身体{
显示器：flex；
最小高度：100vh；
弯曲方向：立柱；
}
主要{
flex:1800px；/*新*/
}
a{
位置：固定；
右：40px；
底部：40px；
}

导航内容
主要内容
页脚内容
edited question我实际上不使用800px作为主标记。我用800px轻松地写了它。我实际上没有使用800px作为主标记。我用800px轻松地写了它。我试了又试了你建议的脚本代码。非常感谢。在jquery标记为我修复之前，只需添加“html”。非常感谢。
$('body,html').animate({
  scrollTop: 0
}, 1000);