Javascript 分配 CSS 背景图像问题

Question

我写了这段代码，为每个 class.hpCarousel 提供了相关的背景图像。

图片名称为：0bg.jpg、1jpg.bg、2bg.jpg 等...

for (i=0; i < 8; i++) {
$('.hpCarousel:eq('+i+')').css('background-image', 'url(wp-content/themes/blankslate/assets/carousel/'+i+'bg.jpg');
}

它在 Firefox 中运行良好。这些类具有分配了正确背景图像的样式。

它不适用于 Chrome OSX&WIN /Safari OSX/ IE。 The.hpCarousel class div没有样式。

起初我以为这与 Chrome 的后台刷新错误有关。 但是在其他浏览器上找到它让我有了不同的想法。

我显然做错了什么吗？

这些类在加载时隐藏。 这有什么区别吗？ 然后他们一个接一个地淡入淡出，产生一个旋转木马

Answer 1

你在 FireBug 中有错误吗？ 您可以在循环中使用另一个（更通用的）选择器：

$('.hpCarousel:nth-child(' + i + ')')

$.each迭代器也是一种更方便的遍历背景的方法。

$('.hpCarousel').each(function(index) {
    $(this).css('background-image', 'url(wp-content/themes/blankslate/assets/carousel/'+index+'bg.jpg');
});