確認有載入 jquery

JS

$('.header-device-menu-btn').on('click', function () {

  if ($(this).text().indexOf('dehaze') == -1) {
    $(this).text('dehaze');
    $('.header-device-menu-layout').fadeOut();
  } else {
    $(this).text('clear');
    $('.header-device-menu-layout').fadeIn();
  }
});

觸發 fadeIn 按鈕

<i class="material-icons header-device-menu-btn">dehaze</i>

出現的區塊

<div class="header-device-menu-layout display-none">
  XXX
</div>

CSS

.header-device-menu-layout {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    z-index: 101;
  }
  .header-device-menu-btn {
    font-size: 30px;
  }

點擊的時候會出現，但不是以 fadeIn 的方式
而是很像「show()」的效果，立馬就出現
但是當 fadeOut() 時，他會延緩大概500毫秒後才會消失，也是立馬就消失⋯⋯
這是咋了啊，第一次遇到這種情況
（谷歌瀏覽器）
show跟hide正常，動畫的都失效