Update link within a variable

Asked

Viewed 39 times

1

I have the following code:

// 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);

The goal is to get a new image of https://unsplash.it every ten seconds.

But the image is always the same...
I can’t clean the variable bottom with a new value. If you need the complete code or the link of the site I can send.

javascript jquery
  • 1

    I’m not sure why you’re using that parameter ? Random? + data1, because when testing this on the site, it always generates the same image, regardless of the value of the data1...

  • 1

    You can try to pass the timestamp (cache) separated by &, and not for a second ?, what may be causing the browser to ignore you - something like fundo = 'https://unsplash.it/g/' + width + '/' + height + '?random&_=' + data1

  • You want the image to change every how long?

  • @Julyanofelipe ignore ? Random? is an unfortunate attempt to add a date at the end of the URL to "force" the refresh of the variable.

  • @Julyanofelipe I want to change every 10 seconds, but the problem is not the time itself, the problem is that the variable does not change. The image is always the same.

  • Test allocate the creation of the variable by placing it within the function

  • @carlosfigueira worked first, thank you very much friend, from heart.

  • 1

    Don’t forget to call the correct URL https://unsplash.it/width/height/? Random

Show 3 more comments

1 answer

1


In order for the image to be different, you need to pass a parameter that varies to the URL being used - if you do not cache the browser you will assume that the image you are looking for is the same (since the URL has not changed) and will use the local version (cache).

You had the right idea, but there is a problem in the implementation: to separate the parameters from the query of the URL you must use the &, and not the ?. If you change the line 

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

for

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

You should receive a different image each call.

  • You’ve helped me so much, thank you again!

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.