.switchClass（）作用於類，但不緩解不發生

我想通過使用jQuery UI switchClass（）方法來揭示一個具有給定類的div的集合（我切換的類不是我正在使用的類以選擇div）.switchClass（）作用於類，但不緩解不發生

我的主要目標是div應該在各州之間進行動畫處理，具體來說就是調整高度（從零隱藏到非零曝光）。

switchClass方法允許您指定我已經完成的轉換時間，但是當類正確切換時，狀態是延遲瞬時的（不是過渡的），所以在延遲等於指定的緩解時間後，類交換髮生瞬間

這裏是我的代碼：

jQuery的

 function revealWarnings(){ 
     $('.container-warning').switchClass('packed', 'unpacked', 1000, 'linear');    
    }

CSS

.packed{ 
height:0 !important; 
} 
.unpacked{ 
height:32px !important; 
}

我的jQuery UI（從我的源文件規定）是：

jQuery用戶界面 - v1.11.4 - 2015年4月5日

來源

2015-05-05 Gideon

在類應用CSS轉換你切換時也可以給你想要的效果 – JLF

的問題是!important符號在你的CSS規則，將替換動畫應用的內聯CSS。

.packed { 
    height:0; 
} 
.unpacked { 
    height:32px; 
}

演示：Fiddle

注意：如果您有任何特別原因需要使用!important，請分享（和使用上述小提琴重現該問題），以便我們可以看看它。

如果你可以使用CSS3動畫然後

.container-warning { 
    overflow-y: hidden; 
    transition: height 1s; 
} 
.packed { 
    height:0 !important; 
} 
.unpacked { 
    height:32px !important; 
}

然後

$('.container-warning').removeClass('packed').addClass('unpacked');

演示：Fiddle

來源

2015-05-05 04:15:36

太棒了 - 謝謝。我只是使用！重要的，因爲我想確保無論我使用那些類，他們會覆蓋其他任何東西，但我想如果它們被內聯應用，他們總是會無論如何。感謝您修復它！ – Gideon

確保包括jQuery的UI。 css文件。

<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

來源

2015-05-05 02:27:36 user86745458

.switchClass（）作用於類，但不緩解不發生

回答

相關問題