Jquery 在addClass上阻止CSS转换
我有以下代码,非常适合悬停转换:Jquery 在addClass上阻止CSS转换,jquery,css,transition,Jquery,Css,Transition,我有以下代码,非常适合悬停转换: #main_nav a, #main_nav a:visited { display: block; width: 240px; margin: 3px 0 0 10px; padding: 3px 10px; color: #808080; background-color: #f2f2f2; border: 1px solid #ccc; border-radius: 5px; tran
#main_nav a, #main_nav a:visited {
display: block;
width: 240px;
margin: 3px 0 0 10px;
padding: 3px 10px;
color: #808080;
background-color: #f2f2f2;
border: 1px solid #ccc;
border-radius: 5px;
transition: 0.3s all;
}
#main_nav a:hover, #main_nav a:active, #main_nav a.active {
width: 250px;
margin-left: 0;
color: #000;
text-decoration: none;
background-color: #fff;
}
但是,当我使用JavaScript应用类active
时,我希望它立即获取属性而不触发转换。我一直在挖,在这上面找不到任何东西
这里有一把小提琴显示了这个问题:如果你想阻止它发生,你需要覆盖
#main_nav a
通过如下放置新规则,以便在应用classactive
时重置转换,否则锚点将从规则#main_nav a
继承转换:
#main_nav a.active {
transition:none;
}
请注意,如果使用JS删除该类,仍然会得到一个转换。