пользовательский фон fadeInOut галерея - PullRequest
Новая
       7

пользовательский фон fadeInOut галерея

1 голос
/ 22 декабря 2011

Из-за этого переходы fadeInOut фонового изображения производят странный эффект белого цвета всех текстов Я решил запрограммировать свой собственный ротатор изображения с эффектом fadeinout 

var intervalo;
var i= 0;
var photos = [
    "http://toniweb.us/gm/img/galeria/fondo1.jpg",
                "http://toniweb.us/gm/img/galeria/fondo2.jpg",
                "http://toniweb.us/gm/img/galeria/fondo3.jpg",
                "http://toniweb.us/gm/img/galeria/fondo4.jpg"
];

function rotarFondo(){
    var container = $('#headerimgs');
    var current = container.children('div:visible:first');
    var imgSrc = photos[i];
    i++;
    if(i == photos.length)
         i = 0;

    console.log(imgSrc);
    var next = (current.next().length > 1) ? current.next() : container.children('div:visible');
    current.css('background',imgSrc);
    next.css('background',imgSrc);

    current.fadeOut(300);
    next.fadeIn(300);
}

function congelarFondo(){

}

$(document).ready(function(){
       if (intervalo )
        clearInterval(intervalo );
       intervalo = setInterval('rotarFondo()',1000);
});

интервал иРасчет изображения, кажется, работает нормально, но я не знаю, почему bgImgaes на самом деле не применяются,

Тестирование здесь сейчас http://jsfiddle.net/bE9Dq/27/

любая идея ??

1 Ответ

1 голос
/ 22 декабря 2011

Ну, для начала, это может сэкономить вам время и несколько головных болей при использовании одного из этих плагинов:

(я использовал их обоих)

Первое, что я заметил в вашем коде, это то, что вам может потребоваться установить фоновое изображение следующим образом: 

.css('background-image','url(' + imgSrc + ')');

Также обратите внимание на вторую строку (next.), которую вы все еще используете imgSrc Я думаю, что вы хотите использовать imgSrc1 вместо?

...