Javascript - 反转模态动画

Question

我正在构建的网站上有一些元素onclick 激活 modal like this .

现在动画是单向的，当您关闭它或从模态的焦点上单击时，它就会消失。从我一直在阅读的内容来看，人们似乎使用 fadeIn/slideIn 动画来实现一次性效果，但是否有可能反转动画，而不是仅仅将显示更改为无，而是滑回？

Answer 1

#modal{bottom: 0; opacity: 1; transition: bottom 400ms, opacity 400ms; }
#modal.hidden{bottom: -300px; opacity: 0}

然后在按钮点击事件中:

$("#modal").addClass("hidden")

关闭事件:

$("#modal").removeClass("hidden")

如果您需要纯 javascript，代码会多一些，但基本上就是这样