0

我有 5 个 div #BS1,#BS2,#BS3,#BS4,#BS5 .. 当悬停在容器 div（左侧）上时，我需要制作每个 div，我需要隐藏每个 div，延迟可能从 5000 到 2000并再次可见！那是我的代码

$("#left-section-5").hover(function () {
    $("#BS1").css("display", "none").delay(500).css("display", "block");
    $("#BS2").css("display", "none").delay(50).css("display", "block");
});
4

1 回答 1

1

该.delay()方法仅延迟相关元素上的后续动画，并且该.css()方法不是动画方法。使用.hide()and.show()代替，它们是（如果您提供持续时间）动画方法：

$("#BS1").hide(1).delay(2000).show(1);
// etc.

或者，如果您想要更高级的效果，请尝试其他一些效果方法，例如：

$("#BS1").fadeOut("slow").delay(2000).fadeIn("slow");

如果通过“序列.css()”表示您希望元素一个接一个地进行动画处理，您可以执行以下操作：

var $divs = $('div[id^="BS"]'),
    i = 0;
function next() {
    if (i < $divs.length)
        $divs.eq(i++).animate({"opacity":0}, 300)
                     .delay(100)
                     .animate({"opacity":1}, 300, next);
}
next();

演示：http: //jsfiddle.net/r4byV/

于 2013-11-13T11:17:36.550 回答