javascript - Javascript分配的CSS背景图像问题

Question

我编写了这段代码，为每个类 .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。.hpCarousel 类 div 没有样式。

在此处输入图像描述

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

我显然做错了什么吗？

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

score 0 · Accepted Answer

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

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

此外，$.each迭代器是一种更方便的方式来遍历您的背景。

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

1 回答 1