javascript - 使用 toggleClass() 函数时如何淡化更改？

Question

下面是我试过的。类会切换，但不会消失。

function showNav(){
            $("div.divNav").toggleClass("showNav");
            $("div.divNav").fadeToggle("slow");
        }

是否可以改用 CSS 过渡？

Answer 1

尝试先切换淡入淡出，然后关闭类:

function showNav() {
  $("div.divNav").fadeToggle("slow");
  $("div.divNav").toggleClass("showNav");
}
setTimeout(function() {
  showNav();
}, 300);

.divNav {
  width: 150px;
  height: 150px;
  background: #000;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="divNav">
</div>