javascript - 循环 css 背景

Question

嘿，我只是想知道如何循环浏览一堆图像，并将它们设置为 div 的背景。

我想要做的是:将第一张图片设置为 div 的背景。等待 X 秒。将下一张图片设置为背景。等待 X 秒……等等，然后继续

我有以下适用于 1 张图像的代码。

$(document).ready(function() {
  var source = $(".field-field-background img:first").attr("src");
  $('.field-field-background img:first').remove();
  $('#main-inner').css('background', 'url('+ source +') no-repeat');
});

我猜我需要获取一个图像源数组，遍历该数组并将其设置为背景，并在循环中的某处进行延迟。我有什么想法吗？

Answer 1

jQuery 的最大优点之一是它有一个 very robust plug-in community .许多您可能想要完成的任务在您之前已由其他人完成。特别是对于这样的常见任务，我建议先寻找插件，然后再尝试重新发明轮子。许多插件具有经过严格测试和多个版本的优势，从而产生了完善的产品。

jQuery Cycle plug-in将是一个很好的候选人，如果你想做一个幻灯片类型的效果。如果你想要循环背景，同时保留前景元素，你可能会看到更像这样的东西:Advanced jQuery background image slideshow