1

Tenho o seguinte código:

// Vegas
// $(".bg-fixed").vegas({
//     slides: [
//         { src: "/img/fundos/slide1.jpg" },
//         { src: "/img/fundos/slide2.jpg" },
//         { src: "/img/fundos/slide3.jpg" }
//     ],
//      overlay: '/js/vegas/overlays/03.png'
// });


//$(".bg-fixed").vegas();

var height = $(window).height();
var width = $(window).width();
var fundo = '';
//var x = 0;

function setBackground() {
    d = new Date();
    data1 = d.getTime();
    fundo = 'https://unsplash.it/g/' + width + '/' + height + '?random?' + data1;

    console.log(fundo)

    var slides = $(".bg-fixed").vegas('options', 'slides');
  slides.push({src:fundo});

    //$(".bg-fixed").vegas('options', 'transition', 'slideLeft2').vegas('next');

    $(".bg-fixed")
    .vegas('options', 'slides', slides)
    .vegas('options', 'transition', 'slideDown')
    .vegas('options', 'overlay', '/js/vegas/overlays/03.png')
    .vegas('jump',    slides.length - 1)
    .vegas('options', 'transition', 'slideLeft2');

    delete fundo;

}

setBackground();

setInterval(setBackground, 10000);

O objetivo é pegar uma imagem nova de https://unsplash.it a cada dez segundos.

Porem a imagem é sempre a mesma...
Não consigo limpar a varável fundo com um novo valor. Se precisarem do código completo ou do link do site eu posso enviar.

8
  • 1
    Não entendi ao certo o por que você está utilizando aquele parâmetro ?random? + data1, pois ao testar isso no site, ele sempre gera a mesma imagem, indiferentemente do valor do data1... Commented 5/07/2016 às 19:01
  • 1
    Você pode tentar passar o timestamp (cache buster) separado pelo &, e não por um segundo ?, o que pode estar fazendo com que o navegador o ignore - algo como fundo = 'https://unsplash.it/g/' + width + '/' + height + '?random&_=' + data1 Commented 5/07/2016 às 19:01
  • Você deseja que a imagem mude a cada quanto tempo? Commented 5/07/2016 às 19:02
  • @JulyanoFelipe ignore o ?random? é uma tentativa infeliz de adicionar uma data ao final da URL para "forçar" o refresh da variável. Commented 5/07/2016 às 19:04
  • 1
    Não esqueça de chamar a URL correta unsplash.it/width/height/?random Commented 5/07/2016 às 19:10

1 Resposta 1

1

Para que a imagem seja diferente, você precisa passar um parâmetro que varie para a URL que está sendo usado - se não o fizer o cache do navegador vai assumir que a imagem que você está querendo buscar é a mesma (já que a URL não mudou) e vai usar a versão local (cache).

Você teve a ideia correta, mas há um problema na implementação: para separar os parâmetros do query da URL você deve usar o &, e não o ?. Se você trocar a linha

fundo = 'https://unsplash.it/g/' + width + '/' + height + '?random?' + data1;

por

fundo = 'https://unsplash.it/g/' + width + '/' + height + '?random&_=' + data1;

Você deve receber uma imagem diferente a cada chamada.

1
  • Me ajudou muito, obrigado mais uma vez! Commented 5/07/2016 às 19:29

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .