jquery - slideDown 有效，但是当我更改为 slideUp 时，它停止工作

Question

我有 2 个小 div，并排在一个更大的 div 中，显示 flex。我希望其中一个小 div 通过向上滑动出现，另一个通过向下滑动出现。向下滑动时它们都可以正常工作，但是当我将其中一个更改为向上滑动时，它不会显示 div。

我已经尝试过 position:relative，也在 jQuery 中使用 hide() 和 show() 函数，而不仅仅是在我的 css 中显示：none。但是我知道 css 中的 display:none 在向下滑动时可以正常工作，所以我只是不明白！

   <div class="nousEtMission">
        <div id="quiSommesNous"> TEST 1
        </div>
        <div id="mission"> TEST 2
        </div>
    </div>

<script>

        $(document).ready(function () {
        $("#header").fadeIn(1500);
        $("#quiSommesNous").slideUp(3000);
        $("#mission").slideDown(3000);
</script>

.nousEtMission{
    display: flex;
    justify-content: space-evenly;
    height: 30vh;
}

#quiSommesNous{
    display: none;
    position: relative;
    background-color: rgb(123, 216, 35);
    width: 50%;
}

#mission{
    display: none;
    position: relative;
    background-color: rgb(26, 207, 132);
    width: 50%;
}

标签： jqueryslidedownslideup