Want to create interactive content? It’s easy in Genially!

Get started free

JAVA-QUIZ

Michele Petruzzelli

Created on May 11, 2023

Start designing with a free template

Discover more than 1500 professional designs like these:

Transcript

JAVA-QUIZ

START

INdice

4 IMMAGINI 1 PAROLA

QUIZ-SCACCHI

QUIZ-FOTO

FAMILY FEUD

QUIZ-CULTURAGENERALE

TROVAL'INTRUSO

FINE

01

4 IMMAGINI 1 PAROLA

"Quattro immagini 1 parola" è un gioco che mette alla prova la tua capacità di associazione e intuizione. Il gioco presenta quattro immagini che hanno qualcosa in comune e l'obiettivo del giocatore è scoprire quale parola si nasconde dietro le immagini.

descrizione del codice

  • L'intestazione del documento specifica il titolo della pagina.
  • Il corpo del documento contiene vari moduli di form, ciascuno identificato con un id unico.
  • Ogni modulo di form include una descrizione del gioco e una raccomandazione per scrivere la parola in minuscolo.
  • Ogni modulo di form contiene una sequenza di quattro immagini, allineate due per riga, utilizzando il tag <img> e l'attributo "src" per specificare i percorsi delle immagini.
  • Ogni modulo di form fa riferimento a un file CSS esterno chiamato "4immagini.css" per la formattazione.
  • Ogni modulo di form include uno script JavaScript incorporato che definisce una funzione specifica.
  • La funzione JavaScript viene eseguita quando si fa clic sul pulsante "Scrivi parola" nel modulo di form corrispondente.
  • La funzione richiede all'utente di inserire una parola tramite la finestra di dialogo prompt() e confronta la parola inserita con una parola specifica per quel modulo.
  • Se la parola inserita corrisponde alla parola corretta, viene visualizzato un messaggio di avviso "Parola corretta".
  • In caso contrario, viene visualizzato un messaggio di avviso "Ritenta, sarai più fortunato!".

02

QUIZ-SCACCHI

Un quiz sugli scacchi è un gioco che mette alla prova la tua conoscenza e comprensione del gioco degli scacchi. In genere, il quiz è composto da una serie di immagini relative alla mossa migliore in base alla situazione in cui ci si può trovare in una vera partita.

descrizione del codice

  • Sono presenti tre array: ans(contiene le risposte corrette per ciascuna domanda), done(tiene traccia delle domande a cui l'utente ha già risposto), e stat(tiene traccia dello stato delle risposte dell'utente).
  • Quando l'utente seleziona una risposta tramite un pulsante radio, viene invocata la funzione Engine(question, answer).
  • Questa funzione confronta la risposta scelta dall'utente con la risposta corretta per la domanda corrispondente.
  • Aggiorna le variabili di stato e punteggio in base alla risposta dell'utente.
  • Mostra un avviso se l'utente ha già risposto alla domanda in questione.
  • Quando l'utente ha risposto a tutte le domande, viene chiamata la funzione NextLevel().
  • Questa funzione genera una stringa HTML che mostra il punteggio dell'utente e indica se le risposte date sono corrette o errate per ciascuna domanda.
  • La stringa HTML viene visualizzata nell'elemento <div> con l'ID "risultato".
  • Il corpo del documento contiene un modulo di form con le domande del gioco.
  • Per ogni domanda, è presente una legenda che descrive il contesto della posizione degli scacchi tramite un'immagine.
  • Ogni domanda ha quattro opzioni di risposta rappresentate da pulsanti radio, ciascuno con un valore corrispondente alla risposta scelta dall'utente.
  • Dopo il modulo di form, c'è un pulsante "Risultato" che consente all'utente di visualizzare il punteggio finale.
  • Quando l'utente fa clic su questo pulsante, la funzione NextLevel() viene invocata.
  • Alla fine della pagina, è presente un elemento <div> con l'ID "risultato" che viene utilizzato per visualizzare il punteggio dell'utente e lo stato delle risposte date.

03

QUIZ-FOTO

Questo quiz mette alla prova la tua conoscenza, tramite foto e domande a scelta, di alcune delle celebrità più conosciute al mondo. Il gioco consiste in una serie di 10 immagini di persone famose nel mondo dello spettacolo, della musica, del calcio ecc.. L'obiettivo è quello di riconoscere il nome delle persone in foto scegliendo una tra le quattro risposte disponibili.

descrizione del codice

  • Il file CSS esterno chiamato "QUIZ FOTO.css" viene incluso nel tag <head> per fornire lo stile al quiz.
  • Le variabili ans, done, stat, score, e count vengono dichiarate per gestire la logica del gioco.
  • L'array ans memorizza le risposte corrette per ciascuna domanda.
  • Gli array done e stat tengono traccia delle domande a cui l'utente ha già risposto e dello stato delle risposte date.
  • La variabile score tiene traccia del punteggio dell'utente.
  • La funzione Engine(question, answer) viene chiamata quando l'utente seleziona una risposta tramite i pulsanti radio. Confronta la risposta scelta dall'utente con quella corretta, aggiorna le variabili di stato e punteggio, e mostra un avviso se l'utente ha già risposto alla domanda.
  • La funzione NextLevel() viene chiamata quando l'utente ha risposto a tutte le domande. Genera una stringa HTML che mostra il punteggio dell'utente e indica se le risposte date sono corrette o errate per ciascuna domanda. La stringa HTML viene visualizzata nell'elemento <div> con l'ID "risultato".
  • Il corpo del documento HTML contiene un modulo di form che include le domande del quiz. Ogni domanda è racchiusa nel tag <fieldset>, che contiene una legenda e un'immagine corrispondente alla domanda. Le opzioni di risposta sono rappresentate da pulsanti radio con eventi onClick che richiamano la funzione Engine() con i parametri corrispondenti alla domanda e alla risposta selezionata.
  • Alla fine del documento, c'è un pulsante "Risultato" che permette all'utente di visualizzare il punteggio finale. Quando l'utente fa clic su questo pulsante, la funzione NextLevel() viene invocata e il risultato viene visualizzato nell'elemento <div> con l'ID "risultato".

04

FAMILY FEUD

Family Feud è un popolare gioco a quiz televisivo, originariamente ideato negli Stati Uniti e trasmesso in molti paesi in tutto il mondo. L'obiettivo è quello di rispondere ad una serie di domande. Per ricevere un punto bisogna rispondere a queste domande con la risposta più popolare.

descrizione del codice

  • L'inizio del documento HTML è definito con <!DOCTYPE html> e il tag <html> che racchiude tutto il contenuto.
  • Nel tag <head>, viene specificato il set di caratteri utilizzato (<meta charset = "UTF-8">) e il titolo della pagina (<title>4 IMMAGINI UNA PAROLA</title>).
  • All'interno del tag <body>, è presente un modulo di form con l'ID "domanda" che conterrà le domande del quiz.
  • All'interno del modulo di form, ci sono alcuni <fieldset> che contengono delle istruzioni per il gioco.
  • Viene incluso un file CSS esterno chiamato "family_feud.css" per fornire lo stile al quiz.
  • Vengono definite le domande del quiz utilizzando tag <p>, seguite da una funzione JavaScript che gestisce la risposta dell'utente.
  • Per ciascuna domanda, è presente un modulo di form con un pulsante "Scrivi parola" (<input type="button">) che richiama una funzione JavaScript specifica per la domanda corrispondente.
  • Ogni funzione JavaScript gestisce la risposta dell'utente tramite l'utilizzo della funzione prompt(), confrontando la risposta inserita dall'utente con una risposta corretta predefinita. In base alla risposta dell'utente, viene mostrato un messaggio di avviso utilizzando la funzione alert().
  • Dopo ogni modulo di form, viene inserito un <br> per separare le domande successive.
  • Alla fine del documento HTML, non è presente alcuna descrizione del codice.

05

QUIZ-CULTURA GENERALE

Un quiz di cultura generale è un test che mette alla prova la conoscenza e la comprensione generale di vari argomenti. Il quiz è composto da una serie di domande a scelta multipla che coprono una vasta gamma di categorie, come storia, geografia, scienze, arte, musica, sport, letteratura e molto altro.

descrizione del codice

  • All'inizio del documento, viene incluso il file CSS "Cultura_generale.css" tramite il tag <link> per gestire lo stile visivo del quiz.
  • Viene definito un array JavaScript ans che contiene le risposte corrette per ciascuna domanda.
  • Sono presenti le variabili JavaScript done, stat, score e count per tenere traccia dello stato delle domande e del punteggio.
  • Successivamente, sono definite le funzioni JavaScript Risposte(question, answer) e Vis_Risultato().
    • La funzione Risposte viene chiamata quando l'utente seleziona una risposta. Verifica se la risposta è corretta confrontandola con l'array ans. Incrementa il punteggio e aggiorna lo stato della domanda.
    • La funzione Vis_Risultato viene chiamata quando l'utente ha risposto a tutte le domande. Mostra il punteggio totale e visualizza le risposte corrette e sbagliate per ciascuna domanda.
  • Nel corpo del documento, è presente un form che contiene tutte le domande del quiz.
  • Ogni domanda è rappresentata da un fieldset con una legenda e le opzioni di risposta.
  • Per le domande a risposta multipla, vengono utilizzati input di tipo checkbox (per selezionare più risposte) o radio (per selezionare una sola risposta).
  • Per ogni opzione di risposta, viene impostato l'attributo onClick per chiamare la funzione Risposte e passare il numero della domanda e il valore selezionato.
  • Dopo le domande, è presente un pulsante <input type="button"> con l'attributo onClick="Vis_Risultato()" per visualizzare il risultato del quiz.
  • Alla fine del documento, c'è un elemento <div> con l'id "risultato" che verrà utilizzato per mostrare il punteggio e le risposte corrette.

06

TROVA L'INTRUSO

Un quiz nel quale l'obiettivo e quello di trovare l'intruso in un gruppo di 5 immagini Il quiz è composto da 5 immagini tra cui l'utente dovrà dedurre quale non ha niente in comune con le altre. Nel momento in cui si sceglie l'immagine corretta appare un messaggio che ti dice di aver trovato lintruso.

descrizione del codice

  • I frammenti di codice HTML forniti rappresentano diverse pagine web per un gioco chiamato "Trova l'Intruso".
  • Ogni pagina ha un tema diverso, tra cui uccelli, verdure, creature marine, animali e pianeti.
  • Ogni pagina include un fieldset con il titolo "TROVA L'INTRUSO" e un pulsante per passare alla pagina successiva.
  • La struttura di base di ogni pagina è simile: un div di contenitore contiene un fieldset che contiene una serie di immagini rappresentanti il tema specifico.
  • In ogni gruppo di immagini, una di esse è contrassegnata come l'intruso.
  • Il giocatore può cliccare sulle immagini per selezionarle, e in risposta verrà visualizzato un avviso che indica se l'immagine selezionata è l'intruso o meno.
  • Ogni volta che il giocatore individua correttamente l'intruso, può procedere alla pagina successiva tramite il pulsante fornito.
  • In breve, questi frammenti di codice HTML rappresentano le diverse pagine di un gioco interattivo in cui il giocatore deve cercare e selezionare l'intruso tra un gruppo di immagini a tema.

GRAZIE

PETRUZZELLI MICHELECinotti francesco VIRGILIO GABRIELE PARADIES FRANCESCO ADDARIO ANTONIO