Javascript Velocity.js动画延迟

我有点沮丧，因为velocity js在我的代码中表现得很奇怪

如果我没有指定任何延迟时间，这些动画如何按顺序进行？读了Velocity文档后，我认为这应该是模拟动画。。。但这就像：身体动画，菜单动画。这甚至不是代码中的序列。有人能告诉我原因吗

$('#pr-nav-icon').click(function() {
    $('#hamburger-menu-drop').velocity({marginLeft: "0px"}, {
        duration: 300,
        delay: 0,
        easing: 'easeInOutQuart'
    });
    $('body').velocity({marginLeft: "440px"}, {
        duration: 300,
        delay: 0,
        easing: 'easeInOutQuart'
    });
});

以下是我对这些元素的sass，如果可能的话：

#hamburger-menu-drop {
  max-width: 420px;
  background: white;
  position: fixed;
  right: 0px;
  bottom: 0px;
  left: 0px;
  top: 0px;
  z-index: 9999;
  background-color: $darktext;
  overflow-y: auto;
  box-shadow: inset -10px 0 5px -5px hsla(0, 0%, 0%, 0.25);
  margin-left: -420px;
}

body {
  width: 100%;
  height: 100%;
  background: #fff;
  line-height: 1.55;
  font-family: $titlefont;
  -webkit-font-smoothing: antialiased;
  font-weight: 300;
  margin: 0;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  color: $darktext;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
  font-smooth: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow-x: hidden;
  font-size: 1.8rem;
  line-height: 1.25;
}

如果设置“body”和“hamburger menu drop”的动画持续时间为“300”，您会注意到，如果将body上的持续时间设置为5秒，“hamburger menu drop”设置为.3秒，您将看到一个在另一个之前发生。我已经将身体的背景改为黄色，这样你就可以直观地看到发生的变化

$（“#pr导航图标”）。单击（函数（）{
$（“#汉堡包菜单下拉菜单”）.velocity({
marginLeft：“0px”
}, {
持续时间：300，
延迟：0，
放松：“轻松出夸脱”
});
$（'body'）。速度({
背景颜色：“ffcc3a”
}, {
持续时间：5000，
延迟：0，
放松：“轻松出夸脱”
});
});
按钮{
宽度：15%；
}
#汉堡包菜单{
最大宽度：420px；
背景：白色；
位置：固定；
右：0px；
底部：0px；
左：0px；
顶部：0px；
z指数：9999；
背景色：$darktext；
溢出y：自动；
盒影：嵌入-10px05px-5pxHSLA（0,0%，0,0.25）；
左边距：-420px；
}
身体{
宽度：100%；
身高：100%；
背景：#fff；
线高：1.55；
字体系列：$titlefont；
-webkit字体平滑：抗锯齿；
字体大小：300；
保证金：0；
-moz osx字体平滑：灰度；
-webkit文本大小调整：100%；
颜色：$darktext；
显示：-网络工具包盒；
显示：-webkit flex；
显示：-ms flexbox；
显示器：flex；
-网络工具包盒方向：垂直；
-webkit盒方向：正常；
-webkit柔性方向：列；
-ms-flex方向：列；
弯曲方向：立柱；
最小高度：100vh；
字体平滑：自动；
-webkit框大小：边框框；
-moz框大小：边框框；
框大小：边框框；
溢出x：隐藏；
字体大小：1.8rem；
线高：1.25；
}

点击我
汉堡包
我想问题出在哪里，这真是我的愚蠢错误。当然，正如Thomas指出的那样，velocity.js工作正常。问题是，我试图为身体和身体中的菜单设置动画，所以动画消失了。
嗨，托马斯。谢谢你的回答！诀窍是我不能同时设置这两个div的动画。我想，如果我把同样的时间和放松放在两个div上，那么它们应该以一个平滑的运动向右移动。但我一个接一个地翻译。