我有this jsbin原型(prototype),有两个菜单项,点击时显示子菜单:
子菜单的可见性由fadeIn()
和fadeOut
控制。但是,不透明度不会产生动画。它只是等待指定的时间,然后完全出现或完全隐藏。不褪色。
代码非常简单,所以我很困惑......
(function(){
var activeMenu = null;
var animation = {
duration: 250,
queue: true
};
$(document).click(function(){
if(activeMenu) {
$(activeMenu).removeClass('active-nav-item');
$(activeMenu).find('.nav-group').fadeOut(animation);
activeMenu = null;
}
});
$.fn.simpleMenu = function() {
$(this).children('.nav-item:has(.nav-group)').each(function(i,e) {
$(e).click(function() {
if(activeMenu) {
$(activeMenu).removeClass('active-nav-item');
$(activeMenu).find('.nav-group').fadeOut(animation);
}
if(activeMenu !== e) {
activeMenu = e;
$(activeMenu).addClass('active-nav-item');
$(activeMenu).find('.nav-group').fadeIn(animation);
return false;
}
});
});
};
})();
$('.global-nav').simpleMenu();
$('.meta-nav').simpleMenu();
最佳答案
我不是 100% 确定,但我认为这是你的问题所在:
* {
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
删除此内容并且不更改其他任何内容后,它会按预期工作。
关于javascript - jquery fade() 不褪色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19341377/