Показать сообщение отдельно
  #1 (permalink)  
Старый 11.11.2014, 20:45
Новичок на форуме
Отправить личное сообщение для Projeka Посмотреть профиль Найти все сообщения от Projeka
 
Регистрация: 11.11.2014
Сообщений: 2

Плавное изменение бэкграунда
Помогите пожалуйста, с синтаксисом JS знаком поверхностно.
пример http://www.thegomezfirm.com/
в примере это реализовано слайдером. Впихнуть слайдер в свой шаблон не получается.
Код примерно такой HTML
<div class="bg">
<p>info</p>
</div>


CSS:
.bg {
background-image: url (/img/bg3.jpg);
}

если
var images = ['/img/bg1.jpg', '/img/bg2.jpg', '/img/bg3.jpg'];
	var i = 0;
setInterval(function(){
            $('.bg').animate({opacity: 0}, 1000, function() {
                if (i >= images.length) {
                    i=0;
                }
                $('.bg').css('backgroundImage','url(' + images[i++] +') ').animate({opacity: 1},1000);
            });
        }, 8000);
        </script>


то пропадает "info"

Как сделать что бы была плавная смена бэкграунда, а "info" оставалось нетронутым ?

т.е. как понимаю надо
.animate({opacity: 1},1000);
использовать в отношении не всего класса .bg а только к свойству 'backgroundImage'
а как это написать не знаю.
Либо другим способом.
Ответить с цитированием