Значение из массива?

Question

[wagwandude]

Добрый день.

Есть два массива:

1. Ссылки фоновых изображений

   var background = [
   	"images/slide_1.png",
   	"images/slide_2.png",
   	"images/slide_3.png"
   ];

   
   
2. Заголовки

   var title = [
   	"Текст 1",
   	"Текст 2",
   	"Текст 3"
   ];

   
   

Со второго получаю из массива заголовки и заменяю их с интервалом:

function rotateTitle() {
	var ct = $("#title_text").data("title") || 0;
	$("#title_text").data("title", ct == title.length -1 ? 0 : ct + 1).text(title[ct])
	.fadeIn().delay(2000).fadeOut(200, rotateTitle);
}

$(rotateTitle);

Всё работает отлично.

Теперь необходимо примерно похожим способом заменить фоновое изображение определенного дива.
Делаю так:

function rotateBackground() {
	var ct = $("#header").data("background") || 0;
	$("#header").data("background", ct == background.length -1 ? 0 : ct + 1).fadeIn()
	.css({'background' : 'url('+ background +') no-repeat', 'background-size':'cover'}).delay(2000).fadeOut(200, rotateBackground);
}

$(rotateBackground);

Но получаю в style:

style="display: block; background: url('images/slide_1.png,images/slide_2.png,images/slide_3.png') 0% 0% / cover no-repeat;"

Иными словами - весь массив.

Уже битый час пытаюсь разобраться с этим.
Подскажите, с какой стороны подойти?

Заранее спасибо.

Answer 1

[Алексей Уколов]

function rotateBackground() {
  var ct = $("#header").data("background") || 0,
      newCt = ct == background.length -1 ? 0 : ct + 1;

  $("#header").data("background", newCt).fadeIn()
  .css({'background' : 'url('+ background[newCt] +') no-repeat', 'background-size':'cover'}).delay(2000).fadeOut(200, rotateBackground);
}