Con nome bandiera by @Luigi98 - Codewith.it

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

Referenze

sizeDetermina le dimensioni dell'elemento in base al valore contenuto
<tfoot>Definisce il footer o sezione inferiore di una tabella.
disabledImpedisce la modifica di un input
acceptDefinisce e filtra il formato dei file per il tag <input type=file>
<h5>Titolo di intestazione di quinto livello
<option>Serve ad inserire una voce in un menu di selezione.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Pascal Landriscina

Ximena\'s hamburger

Clona elementi JS

SEMI al FUTURO [Immagine Home]

Orologio Analitico

esercizio pag. 335

SCHEDA 4 INFORMATICA

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>
  <title>Gioco delle Bandiere</title>
  <script>
    var bandiere = [
      { nome: "Italia", url: "https://translationsandmore.altervista.org/wp-content/uploads/2023/04/it.png	" },
      { nome: "Francia", url: "https://translationsandmore.altervista.org/wp-content/uploads/2023/04/fr.png	" },
      { nome: "Germania", url: "https://translationsandmore.altervista.org/wp-content/uploads/2023/04/de.png	" },
      // Aggiungi altre bandiere con i relativi nomi qui
    ];

    var bandieraCorrente; // Bandiera corrente da indovinare

    function caricaBandieraCasuale() {
      var indiceCasuale = Math.floor(Math.random() * bandiere.length);
      bandieraCorrente = bandiere[indiceCasuale];

      var bandieraElemento = document.getElementById("bandiera");
      bandieraElemento.src = bandieraCorrente.url;
      bandieraElemento.alt = "Bandiera";
      
      // Resetta il testo della risposta precedente
      document.getElementById("risposta").textContent = "";
    }

    function mostraNomeNazione() {
      if (bandieraCorrente) {
        document.getElementById("risposta").textContent = bandieraCorrente.nome;
      }
    }

    function verificaRisposta() {
      var input = document.getElementById("input-nazione").value;
      var rispostaElemento = document.getElementById("risposta");
      if (input.toLowerCase() === bandieraCorrente.nome.toLowerCase()) {
        rispostaElemento.textContent = "Corretto! La nazione è " + bandieraCorrente.nome;
      } else {
        rispostaElemento.textContent = "Sbagliato! Riprova.";
      }
    }
  </script>
</head>
<body>
  <h1>Gioco delle Bandiere</h1>

  <button onclick="caricaBandieraCasuale()">Nuova Bandiera</button>
  <button onclick="mostraNomeNazione()">Mostra Nome Nazione</button>

  <div>
    <img id="bandiera" src="" alt="Bandiera">
    <br>
    <input type="text" id="input-nazione" placeholder="Indovina la nazione">
    <button onclick="verificaRisposta()">Conferma</button>
    <p id="risposta"></p>
  </div>
</body>
</html>

*{ }