.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（）作用于类，但不缓解不发生

回答

相关问题