Не получается изменять background-image

Значит так
У меня есть 4 картинки



Я написал код javascript, чтоб они каждые 4 секунды плавно заменяли друг друга.
Мне нужно, чтоб одновременно с заменами этих картинок менялся и background-color
Я попытался каждой картинке добавить id и каждому id свой background-color, но вместо bg-color всей страницы меняется bg только сзади этих картинок. - вот так


Как сделать, чтоб менялся background-color ВСЕЙ страницы? Вот ссылка на архив с кодом - http://fayloobmennik.com/nlx8jwa6x76b.html

Тебе надо изменить background у всего body?

именно

Блин, жалко что с телефона сижу не могу код посмотреть твой. Не хочу лишние вопросы задавать без кода.

19site
<body>
	<div class="slider">
		<div class="inslider" id="inslider1"><img src="images/slide1.png"/></div>
		<div class="inslider" id="inslider2"><img src="images/slide2.png"/></div>
		<div class="inslider" id="inslider3"><img src="images/slide3.png"/></div>
		<div class="inslider" id="inslider4"><img src="images/slide4.png"/></div>
	</div>
</body>

.inslider {
position: absolute;
display: none;
}

#inslider1 {
background-color: #f17c72;
}

#inslider2 {
background-color: #32ac97;
}

#inslider3 {
background-color: #7f4c76;
}

#inslider4 {
background-color: #3f9fc9;
}

/* точки слидер (slider, inslider) */
$(document).ready(function() {
$(’.slider .inslider’).eq(0).addClass(‘active’).fadeIn(1000);
setInterval(‘blockAnimate();’, 4000);
});

function blockAnimate() {
var length = $(’.slider .inslider’).length - 1;
$(’.slider .inslider’).each(function(index) {
if($(this).hasClass(‘active’) && index != length) {
$(this).removeClass(‘active’).fadeOut(1000).next(’.inslider’).addClass(‘active’).fadeIn(1000);
return false;
} else if (index == length) {
$(this).removeClass(‘active’).fadeOut(1000);
$(’.slider .inslider’).eq(0).addClass(‘active’).fadeIn(1000);
return false;
}
});
};

/* енд точки слидер (slider, inslider) */

Может так будет видно удобнее?

Вообщем смотрите, у вас задан бекграунд колор у блока див insider, его ширина и высота равна его содержимому, если хотите чтоб менялся общий фон, то соответсвенно бекграунд надо прописывать к нему, задайте блоку slider высоту ширину выставьте позицию inslider как вам нужно, и background применяйте к slider, к сожаленью по java ничего не подскажу так как не дошел до его изучения, но уверен если поискать можно найти как реализовать это. Можете еще попробовать, каждый inslider поместит в отдельные блоки slider задать им уникальные id и уже к этим id slider’а применять стиль background, не забудьте только задать ширину slider на весь родительский элемент.

1 лайк

Спасибо, получилось

Не за что. Рад был помочь.