Css 将淡出过渡添加到引导模式，这样就不会退回到起点

基本上，我想做一些非常简单的事情，但不知道如何做，也没有找到解决方案

我有一个模态，当我打开它时，它应该从左移到中心。 关闭它时，它应该向右移动。默认情况下，它会移回左侧

如何为淡出添加额外的过渡

我的代码如下：

.modal {
  &.fade .modal-dialog {
    .translate(-25%, 0);
    .transition-transform(~"0.3s ease-out");
  }
  &.in .modal-dialog { .translate(0, 0) }
}

---

这对我正在寻找的东西不起作用。模式应在淡出时移到右侧，但仍会移回左侧。还有，为什么我的问题给我一个否定的答案？

.fade {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.fade:hover {
   opacity: 0.5;
}