javascript - DOM 元素加载和关闭时的 css 动画

Question

您好，我正在使用 css 动画属性使元素宽度逐渐增长，并且当元素加载到 DOM 时效果很好

我正在使用的代码:

 @keyframes widthSize {
      0% { width: 0; }
      20% { width: 40px; }
      40% { width: 80px; }
      60% { width: 120px; }
      80% { width: 160px; }
      100% { width: 200px; }
 }

.item-popup-list {
animation: widthSize 200ms ease 0s 1;
}

问题是当元素从 DOM 中移除时，我想让它逐渐缩小， 我可以只使用 CSS 吗，还是我必须使用 jQuery(我的代码是 javascript reactJS)

Answer 1

当元素从 DOM 中移除时，您将无法显示动画。您所能做的就是使用 javascript/jQuery 切换类