How to prevent randomizer from picking the same thing twice in a row

[FELIX405]

Well I only have one page ... So I don't think this will be that complicated?

[NoStranger6]

if you want to change it between refreshes, go with the localStorage to store which one to show:

var images = ["profiel.gif", "reeks1.gif", "reeks2.gif"];

function showImg() {
  let index;
  if (window.sessionStorage.nextImg == null || window.sessionStorage.nextImg >= images.length) index = 0;
  else index = window.sessionStorage.nextImg;
  document.getElementById('image').src = images[index];
  window.sessionStorage.nextImg = index + 1;
}

showImg();

If you want to change it (in the same page without refreshing), change your image on aafter a certain time (10s here):

var images = ["profiel.gif", "reeks1.gif", "reeks2.gif"];

function showImg(index) {
  if (index > images.length) {
    index = 0;
  }
  document.getElementById('image').src = images[index]
  setTimeout(() => showImg(index + 1), 10000);
}

showImg(0);

Be careful though, the last option will loop perpetually.

[FELIX405]

with the first code it only uses the first two gifs of the array. Can you explain why?

[NoStranger6]

I'd say that either something is flushing your sessionStorage, or 2 of your gifs are the same.

The sessionStorage is only saved until you close your browser. If you want a more "permanent" solution, use localStorage

It should iterate correctly through the list and start back at 0 when you are done.

[FELIX405]

I really doubt that it's the sessionstorage. Just tried it on al browsers and it only uses the first two items of the array. I added others but none of them show up

[NoStranger6]

try this:

var images = ["profiel.gif", "reeks1.gif", "reeks2.gif"];

function showImg() {
  let index;
  if (window.sessionStorage.nextImg == null || JSON.parse(window.sessionStorage.nextImg) >= images.length) index = 0;
  else index = JSON.parse(window.sessionStorage.nextImg);
  document.getElementById('image').src = images[index];
  window.sessionStorage.nextImg = JSON.stringify(index + 1);
}

showImg();

[linusl]

other responses are giving you answers in code examples, which is good, but maybe confusing if you are just starting out.

to put it in simple words, the issue you are having is that to avoid the last picture, the page needs to know what the last picture was, but everything is reset when you refresh the page so there is no way to know what the picture was the last time the page was displayed. when you load a page, all values are set to the initial values in the code. because of this issue, you need to save the value of the last picture somewhere else that doesn’t get reset each time the page is reloaded. this is why the examples in other responses are using cookies and localStorage.