在jQuery中，如何将多个delay()方法与css()一起使用？

我怎样才能实现以下目标，了解如果我只能使用一次延迟setTimeout:

$(this).css().delay().css().delay().css();

EDIT:

jQuery“.delay()”API 都是关于“效果队列”的。它实际上立即返回。

做到这一点的唯一方法，如果你是not使用“setTimeout()”对 CSS 更改进行动画处理。

可能会让事情变得更愉快的一件事是将 CSS 更改构建到数组中：

var cssChanges = [
  { delay: 500, css: { backgroundColor: "green", fontSize: "32px" }},
  { delay: 1000, css: { backgroundColor: "blue", textDecoration: "underline" }},
  { delay: 750, css: { position: "relative", marginLeft: "5px" }}
];

然后，您可以使用单个例程以所需的延迟遍历列表：

function doChanges(cssChanges) {
  var index = 0;
  function effectChanges() {
    $('whatever').css(cssChanges[index].css);
    if (++index < cssChanges.length) {
      setTimeout(doChanges, cssChanges[index].delay);
    }
   }
   setTimeout(effectChanges, cssChanges[0].delay);
 }

如果您愿意，您可以将其变成一个插件，但如果您打算这样做，最好弄清楚如何使您的插件与 jQuery 中现有的动画队列设施一起播放。