Magyar
Create your own flashcard game for use on the computer using the following resources.
Additional ideas will soon be available on the library’s AI page.
I gave the following instruction to ChatGPT, which could be supplemented with the pairs of words to be used, allowing us to create more precise and useful cards for learning. Similarly, if we have, for example, Hungarian and/or English words, it could create similar flashcards.”
1) Learning words
“Create an HTML code for me that serves to practice the following Hungarian words and their English pairs in flashcard form in Hungarian. The Hungarian terms should appear in random order, but it should keep track to ensure all words are shown and start over once all have been displayed.”
Based on this prompt, here’s the complete HTML code that you can copy into a text editor, save with a .html extension, and open in a browser to play the flashcard “game”: Hungarian – English words
The code:
<!DOCTYPE html>
<html lang=”hu”>
<head>
<metacharset=”UTF-8″>
<metaname=”viewport”content=”width=device-width, initial-scale=1.0″>
<title>Magyar-Angol Flashcard</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: #f0f0f0;
}
.flashcard {
background-color: #fff;
border: 2pxsolid#ddd;
border-radius: 10px;
box-shadow: 04px8pxrgba(0, 0, 0, 0.1);
width: 300px;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
transition: transform 0.3s;
position: relative;
}
.flashcard:hover {
transform: scale(1.05);
}
.flashcard.front, .flashcard.back {
position: absolute;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
backface-visibility: hidden;
transition: transform 0.6s;
}
.flashcard.back {
transform: rotateY(180deg);
}
.flashcard.flipped.front {
transform: rotateY(180deg);
}
.flashcard.flipped.back {
transform: rotateY(0deg);
}
.container {
perspective: 1000px;
}
</style>
</head>
<body>
<divclass=”container”>
<divclass=”flashcard”id=”flashcard”>
<divclass=”front”>
<pid=”hungarian-word”>Tényleges</p>
</div>
<divclass=”back”>
<pid=”english-word”>Actual /ˈæktʃuəl/</p>
</div>
</div>
</div>
<script>
constflashcard = document.getElementById(‘flashcard’);
constwords = [
{ hungarian: ‘Tényleges’, english: ‘Actual /ˈæktʃuəl/’ },
{ hungarian: ‘Kitűzött cél’, english: ‘Ambition /æmˈbɪʃn/’ },
{ hungarian: ‘Megye(i)’, english: ‘County /ˈkaʊnti/’ },
{ hungarian: ‘Gokart’, english: ‘Go-kart /ˈgəʊ kɑːt/’ },
{ hungarian: ‘Ez idáig, mostanáig’, english: ‘Up to now /ˌʌp tə ˈnaʊ/’ },
{ hungarian: ‘Hegyet másztál már valaha?’, english: ‘Have you ever climbed a mountain?’ },
{ hungarian: ‘Díj, kupa’, english: ‘Trophy /ˈtrəʊfi/’ },
{ hungarian: ‘Kétszer’, english: ‘Twice /twaɪs/’ },
{ hungarian: ‘Mennyiség’, english: ‘Amount /əˈmaʊnt/’ },
{ hungarian: ‘Ki van állítva’, english: ‘Be on display /ˌɒn dɪˈspleɪ/’ },
{ hungarian: ‘Szétbomlik’, english: ‘Decompose /ˌdiːkəmˈpəʊz/’ },
{ hungarian: ‘Bírság’, english: ‘Fine (n) /faɪn/’ },
{ hungarian: ‘Javul’, english: ‘Improve /ɪmˈpruːv/’ },
{ hungarian: ‘Felhívja rá a figyelmet, tudatosít valakiben’, english: ‘Make someone aware /meɪk ˈsʌmwʌn əˈweə(r)/’ },
{ hungarian: ‘Valószínűleg’, english: ‘Probably /ˈprɒbəbli/’ },
{ hungarian: ‘Újra feldolgoz, hasznosít’, english: ‘Recycle /ˌriːˈsaɪkl/’ },
{ hungarian: ‘Fóka’, english: ‘Seal /siːl/’ },
{ hungarian: ‘Sajnos’, english: ‘Unfortunately /ʌnˈfɔːtʃənətli/’ },
{ hungarian: ‘Bosszús, dühös’, english: ‘Annoyed /əˈnɔɪd/’ },
{ hungarian: ‘Szóval / Nos …’, english: ‘Anyway … /ˈeniweɪ/’ },
{ hungarian: ‘Automata’, english: ‘Machine /məˈʃiːn/’ },
{ hungarian: ‘Mi a baj? Mi történt?’, english: ‘What’s the matter? /ˌwɒts ðə ˈmætə(r)/’ },
{ hungarian: ‘Tengernagy’, english: ‘Admiral /ˈædmərəl/’ },
{ hungarian: ‘Bárki más’, english: ‘Anybody else /ˌenibɒdi ˈels/’ },
{ hungarian: ‘Csata’, english: ‘Battle /ˈbætl/’ },
{ hungarian: ‘Üzletember’, english: ‘Businessman /ˈbɪznəsmæn/’ },
{ hungarian: ‘Megemlékezik, őrzi emlékét’, english: ‘Commemorate /kəˈmeməreɪt/’ },
{ hungarian: ‘Emlékmű’, english: ‘Monument /ˈmɒnjumənt/’ },
{ hungarian: ‘Tulajdonos’, english: ‘Owner /ˈəʊnə(r)/’ },
{ hungarian: ‘Emléktábla’, english: ‘Plaque /plæk/’ },
{ hungarian: ‘Költő’, english: ‘Poet /ˈpəʊɪt/’ },
{ hungarian: ‘Törzs’, english: ‘Tribe /traɪb/’ },
{ hungarian: ‘Csatolmány’, english: ‘Attachment /əˈtætʃmənt/’ },
{ hungarian: ‘Csevegőszoba’, english: ‘Chatroom /ˈtʃætruːm/’ },
{ hungarian: ‘Tartalmaz’, english: ‘Contain /kənˈteɪn/’ },
{ hungarian: ‘Kitalál’, english: ‘Guess /ges/’ },
{ hungarian: ‘Azonnal’, english: ‘Immediately /ɪˈmiːdiətli/’ },
{ hungarian: ‘Internet, világháló’, english: ‘The Net /ðə ˈnet/’ },
{ hungarian: ‘Felismer’, english: ‘Recognize /ˈrekəgnaɪz/’ },
{ hungarian: ‘Válaszol’, english: ‘Reply /rɪˈplaɪ/’ },
{ hungarian: ‘Feliratkozik, regisztrál’, english: ‘Sign up to … /ˌsaɪn ˈʌp tə/’ },
{ hungarian: ‘Egyszerű’, english: ‘Simple /ˈsɪmpl/’ },
{ hungarian: ‘Kapcsolatháló, közösségi háló’, english: ‘Social network /ˌsəʊʃl ˈnetwɜːk/’ },
{ hungarian: ‘Tárol’, english: ‘Store /stɔː(r)/’ },
{ hungarian: ‘Idegen’, english: ‘Stranger /ˈstreɪndʒə(r)/’ },
{ hungarian: ‘Adattovábbító gomb’, english: ‘Submit /səbˈmɪt/’ },
{ hungarian: ‘Ismeretlen’, english: ‘Unknown /ʌnˈnəʊn/’ },
{ hungarian: ‘elér, véghezvisz’, english: ‘achieve /əˈtʃiːv/’ },
{ hungarian: ‘valaminek tart’, english: ‘consider /kənˈsɪdə(r)/’ },
{ hungarian: ‘bűntény’, english: ‘crime /kraɪm/’ },
{ hungarian: ‘visszatapsolás’, english: ‘curtain call /ˈkɜːtn ˌkɔːl/’ },
{ hungarian: ‘gazdagság’, english: ‘fortune /ˈfɔːtʃuːn/’ },
{ hungarian: ‘társ, pajtás’, english: ‘mate /meɪt/’ },
{ hungarian: ‘sétahajózás’, english: ‘pleasure cruise /ˈpleʒə ˌkruːz/’ },
{ hungarian: ‘büntetés’, english: ‘sentence /ˈsentəns/’ },
{ hungarian: ‘rész’, english: ‘share (n) /ʃeə(r)/’ },
{ hungarian: ‘meghajol’, english: ‘take a bow /ˌteɪk ə ˈbaʊ/’ },
{ hungarian: ‘világegyetem’, english: ‘universe /ˈjuːnɪvɜːs/’ }
];
functiongetRandomWord() {
returnwords[Math.floor(Math.random() * words.length)];
}
functionupdateFlashcard() {
constwordPair = getRandomWord();
document.getElementById(‘hungarian-word’).textContent = wordPair.hungarian;
document.getElementById(‘english-word’).textContent = wordPair.english;
flashcard.classList.remove(‘flipped’);
}
flashcard.addEventListener(‘click’, () => {
flashcard.classList.toggle(‘flipped’);
if (!flashcard.classList.contains(‘flipped’)) {
setTimeout(updateFlashcard, 600); // wait for flip animation
}
});
updateFlashcard(); // initialize with first word
</script>
</body>
</html>