我会在我的班级切换时添加一些过渡或动画，例如，在下面的代码中，我有一个侧边栏，我已经添加了一些动画，使用 CSS 动画库。当侧边栏打开时，我将它与另一个类切换，动画工作，但当它关闭时，动画不再工作。

关于我想要什么的更多细节：

1- 我打算当 sidebar1 类与 sidebar_menu 切换时，一些动画或过渡会增长以应用于它，正如我在顶部解释的那样，我的意思是当侧边栏被关闭时动画或过渡增长以应用于它

2-侧边栏打开时没问题，我只想要侧边栏通过动画打开，通过动画关闭时，如果我解释不好，我很抱歉。如果有任何问题请问我会回答

这是我制作的演示，我认为它显示了我的意思更好的 演示

这是我的 JQ 代码：

$(document).ready(function() {

   $(".response_menu_icon").click(function() {

      $(".sidebar1").toggleClass("sidebar_menu");

   });

   //

   $(".response_more_icon").click(function() {

      $(".area1").toggleClass("area_more");

   });

});

这是我的 HTML 代码：

        Dashboard

        dashboard

这是我的 CSS 代码：

.sidebar1 {

   display: none;

}

.sidebar_menu {

   // display: none;

   width: 250px;

   height: 100%;

   position: fixed;

   top: 80px;

   display: flex;

   flex-wrap: wrap;

   flex-direction: column;

   text-align: center;

   background-color: #ffffff;

   -webkit-box-shadow: -2px 10px 8px 3px #eeeeee;

   -moz-box-shadow: -2px 10px 8px 3px #eeeeee;

   box-shadow: -2px 10px 8px 3px #eeeeee;

}