<style>
:root {
--width-screen: 1500px;
}
#body {
overflow-x: hidden;
}
.container-teste {
display: flex;
width: 100%;
min-height: 100%;
height:auto;
background-color: aquamarine;
transform-style: preserve-3d;
padding-top: 10em;
padding-bottom: 30em;
}
.cube {
display: flex;
height: 80%;
width: 100%;
justify-content: center;
align-items: center;
padding: 2px;
flex-wrap: wrap;
background-color: blueviolet;
border: 10px solid #000;
object-fit: contain;
transform: scaleX(1) scaleY(0.8) scaleZ(0.8) skew(0, 5deg) rotateX(-10deg) rotateY(-62deg) rotateZ(-6deg) translateX(calc(var(--width-screen)/ 2)) translateY(0px) translateZ(0px) skewX(0deg) skewY(0deg);
}
.cube-wrap {
display: flex;
z-index: 0;
justify-content: flex-end;
align-items: center;
height: 100%;
width: 50%;
perspective: var(--width-screen);
perspective-origin: 50% 50%;
align-self: flex-end;
}
.item-cube {
display: flex;
height: 2em;
width: 5em;
background-color: black;
justify-content: center;
align-items: center;
font-size: 1.6em;
margin: 2px;
font-weight: bold;
box-shadow: 1px 2px 2px #050a30;
background-size: cover;
background-repeat: no-repeat;
color: #fff;
}
</style>
<div class="container-teste">
<div class="cube-wrap">
<div class="cube"></div>
</div>
<script>
let itemobjt = [];
for(let i = 0; i < 98; i++){
let item = Math.floor(Math.random() * 9999);
itemobjt.push(item);
elem = document.createElement('div');
elem.setAttribute('id', itemobjt[i]);
elem.setAttribute('class', 'item-cube');
let container = document.querySelector('.cube');
container.insertBefore(elem, null);
}
let root = document.documentElement;
let widthscreen = window.screen.width;
root.style.setProperty('--width-screen', widthscreen+"px" );
</script>
</div>
Boa tarde, Pessoal eu tenho um painel onde nele eu tenho varias divs simbolizando um usuário, e nesse painel gostaria de gerar um sorteio entre essas divs sorteando um numero aleatória que seria o numero de alguma das div no painel e que ao correr esse processo de sorteio ela trocasse a cor da div no painel por cada numero gerado no math.random, e no final teria um botão ou uma função que parasse o sorteio ao deixando selecionado o ultimo id sorteado da div, no entanto n tenho ideia de como fazer esse efeito com Java script ou se sugerirem outra linguagem.
Obs.: meu primeiro post, Grato desde ja.
