Heads Or Tails Random Tally by @Aleshia33 - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

hrefDefinisce l'URL della risorsa/pagina di destinazione.
<map>Inserisce immagini mappa cliccabili in un documento
<td>Definisce una cella di una tabella HTML.
<aside>Definisce un contenuto separato dal testo perincipale
valueValore alfanumerico o booleano contenuto in un elemento
requiredRende obbligatorio un campo di input

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Prenotazione Appuntamento

Pagina prova html

meraviglieItaliaFrame

Mova AI Generico

progetto 3 morra cinese

esercizio 02 pagina complessa

Festava Live - Bootstrap 5 CSS Tem

Tabelle con inserimento immagini

affettiminoriwill

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>Heads Or Tails Tally</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
		integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
		integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
		crossorigin="anonymous"></script>
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.min.js"
		integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
		crossorigin="anonymous"></script>
	<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
	<main class="container">
		<section class="row">
			<div class="col">
				<button class="btn btn-lg btn-success">Generate 100 Head or Tails</button>
			</div>
		</section>

		<div class="row">
			<div class="col">
				<h1>Heads</h1>
				<span>0</span>
			</div>

  <div class="left"> 
    <div class="right">
  </div>

			<div class="col">
				<h1>Tails</h1>
				<span>0</span>
			</div>
		</div>


		<div class="row">
			<div class="col">
				<ul class="heads list-group list-group-flush"></ul>
			</div>
			<div class="col">
				<ul class="tails list-group list-group-flush"></ul>
			</div>
		</div>
	</main>

</body>

</html>

div.col {
	text-align: center;
}

span {
	margin-top: 10px;
	font-size: 64px;
}

button {
	text-align: center;
	font-size: 24px;
}

// STORES THE TOTAL AMOUNT PER CATEGORY
var tally = {
	heads: 0,
	tails: 0
};


// GENERATES CPU RANDOM CHOICE
function createRandomizerRequest(loopMax) {
	document.querySelector(".heads").innerHTML = "";
	document.querySelector(".tails").innerHTML = "";

for( var x = 0; x <loopMax; x++) 

// CREATES ALL RANDOMIZED CHOICES
// DISPLAY DATA IN HTML
function createRandomizerRequest(loopMax) {
for(var x =0; x <30; x++ ){
	 var r = Math.floor( Math.random() * 2 );
	 console.log(r);
	if( r > 0){
		document.querySelector(".left").insertAdjacentHTML("beforeend", `<div>${x}: 
		tails!!!</div>`);
} else {
	document.querySelector(".right").insertAdjacentHTML
	    ("beforeend", `<div>${x}: 
			heads!!!</div>`);
    }
 document.querySelector(".Tally").innerHTML = tally.tails;
}
}
document.querySelector(".btn").addEventListener("click", function (){createRandomizerRequest(100);
});


// RUNS FUNCTION ON DOCUMENT LOAD
createRandomizerRequest(100);