我一直在研究这个 jQuery 效果继承人的小提琴:http: //jsfiddle.net/abtPH/26/
到目前为止一切都很好,但是当我点击元素太快时,它似乎会出现错误并出现奇怪的行为。如果您花时间单击元素,它可以正常工作。
我试过使用:animate
确保动画在用户点击下一个之前结束。不过,我不喜欢这种方法,因为从最终用户看来,效果似乎很滞后。我希望用户能够快速单击元素并获得所需的效果。
到目前为止,这是我的 jQuery:
$('li').on('click', function (e) {
e.preventDefault();
var active = $(this).siblings('.active');
var posTop = ($(this).position()).top;
if (active.length > 0) {
var activeTop = (active.position()).top;
if (activeTop == posTop) {
$(this).find('.outer').fadeIn('medium', function () {
active.toggleClass('active', 400).find('.outer').fadeOut('medium');
});
} else {
$(this).siblings('.active').toggleClass('active', 400).find('.outer').slideToggle();
$(this).find('.outer').slideToggle();
}
} else {
$(this).find('.outer').slideToggle();
}
$(this).toggleClass('active', 400);
});
$('.outer').on('click', function (e) {
return false;
});