Как сделать случайное появление блоков по времени?

Question

[Сергей К]

Как сделать случайное появление блоков по времени?
Пока все блоки появляются только одновременно.
Нужно, чтобы каждые 3 секунды появлялся рандомно один из трех блоков.

https://codepen.io/sergej-korolew/pen/eYrMdRv

<div class="block">
  <div class="inner inner-1">1</div>
  <div class="inner inner-2">2</div>
  <div class="inner inner-3">3</div>
</div>

.block{
  width: 200px;
   border: 1px solid black;
}

.inner {
  padding: 5px;
   height: 50px;
  margin: 5px;
  border: 1px solid black;
  top: -800px;
  position: relative;
}

._active{
  top: 0;
}

const inner = document.querySelectorAll('.inner');
setTimeout(function () {
	inner.forEach(element => {
		element.classList.add('_active')
	});
}, 3000);

Comments

[Сергей Соколов]

не понятно: нужно чтобы все три появились по одному по очереди в случайном порядке?
Или чтобы каждые 3 сек один появлялся остальные исчезали?

[Сергей К]

Сергей Соколов, каждые 3 сек один появлялся остальные и 4 исчезал чтобы одновременно всего три было

[Сергей Соколов]

каждые 3 сек один появлялся остальные и 4 исчезал чтобы одновременно всего три было

@sergei026, что-то не стало от этого понятнее )

Answer 1

[historydev]

Comments

[Сергей К]

Супер! То что нужно, спасибо!
А как сделать чтобы к примеру добавлялись рандомно 3 блока по кругу и когда пытается добавить 4 блок по очереди то тот что был первым в очереди убирался?

[Сергей К]

И желательно чтобы это было анимировано

[historydev]

Сергей К, хочу борщ, есть мясо, картошка и сметана, но желательно чтобы была свекла

[Сергей К]

Владимир, (( хотябы подсказку дайте