Question

在UL列表中，我想要为第一个LI内部设置动画。第一个动画将删除蓝色背景的CSS类，并为其添加一个新的CSS，使其具有深色背景。它还在里面添加了一行代码。第二个动画将推动同一个div，并在其上淡入淡出，以便它消失。然后它将被删除。

我测试的两个动画都是通过注释掉其他动画并正常工作而分开的。问题是我不能一起运行它们，如果我做第一个动画，那么第二个动画根本不会运行。

listTop = $('#ypPlaylist > ul li:first');

setTimeout(function () 
{
    listTop.css('background', '#2d89ef').removeClass('bg-color-blue');
    listTop.animate({ backgroundColor: '#1d1d1d' }, 300);
    listTop.prepend('<b>Running: </b>').fadeTo(300);
}, 1000)

setTimeout(function () 
{
    listTop.animate({ marginTop: '-=82px', opacity: 0 }, 800, function () 
    {
        listTop.remove();
    });
}, 3000);

Answer 1

您可以将所有内容连接在一起，在两者之间设置延迟并删除setTimeouts函数。结帐http://api.jquery.com/animate/和http://api.jquery.com/delay/
还有一个简短示例$('#foo').slideUp(300).delay(800).fadeIn(400);

第二个动画不起作用

1 个答案: