From cfb38e89724b04635713786f3bc741cf79bcd7cb Mon Sep 17 00:00:00 2001 From: structix Date: Thu, 11 Jul 2019 14:34:21 +0200 Subject: [PATCH] Update --- uebung10/quiz.html | 20 ++------ uebung10/style.css | 113 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 118 insertions(+), 15 deletions(-) create mode 100644 uebung10/style.css diff --git a/uebung10/quiz.html b/uebung10/quiz.html index 743406a..f4ec88c 100644 --- a/uebung10/quiz.html +++ b/uebung10/quiz.html @@ -8,15 +8,9 @@ + - - -
Anzahl fragen: @@ -54,6 +48,10 @@ var answer1 = document.getElementById("answer1"); var answer2 = document.getElementById("answer2"); + //buttons zuweisen + answer0.addEventListener('click', answerQuestion); + answer1.addEventListener('click', answerQuestion); + answer2.addEventListener('click', answerQuestion); //Start game function listener() { @@ -68,7 +66,6 @@ function listener() { var right = document.getElementById('right'); var total = document.getElementById('total'); - } //Start a new game @@ -79,7 +76,6 @@ function newGame() { function showQuestion() { var question = questions[currentQuestion]; - questionDiv.innerHTML = question.question; answer0.innerHTML = question.answers[0]; @@ -115,7 +111,6 @@ function answerQuestion(event) { }, 2000); } - function showResult() { screen2.style.display = "none"; @@ -125,11 +120,6 @@ function showResult() { total.innerHTML = questions.length; } -//buttons zuweisen -answer0.addEventListener('click', answerQuestion); -answer1.addEventListener('click', answerQuestion); -answer2.addEventListener('click', answerQuestion); - function getQuestions() { var request = new XMLHttpRequest(); diff --git a/uebung10/style.css b/uebung10/style.css new file mode 100644 index 0000000..ba91758 --- /dev/null +++ b/uebung10/style.css @@ -0,0 +1,113 @@ +body { + font-family: sans-serif; + color: #000; + text-align: center; + transition: background-color 250ms linear; + background-color: #fff; +} + +a { + color: black; +} + +.post, input, textarea { + max-width: 30em; + width: 100%; + padding: 1em; + margin: 1em auto; + background-color: #fff; + border: 1px solid black; + color: black; + text-align: justify; + box-sizing: border-box; + border-radius: 0.5em; +} + +form { + max-width: 30em; + width: 100%; + margin: 0 auto; +} + +input, textarea { + max-width: 100%; + box-sizing: border-box; +} + +.post h1 { + margin: 0; +} + +.post .meta { + font-size: 75%; + font-style: italic; + border-top: 1px dotted black; + border-bottom: 1px dotted black; + padding: 0.25em; +} + +.post a { + color: red; +} + +.post p { + margin: 0 0 0.5em; +} + +.question, .answer { + max-width: 30em; + width: 100%; + margin: 1em auto; + background-color: #fff; + color: black; + text-align: justify; + box-sizing: border-box; + display: block; +} + +.question { + /*background-color: #2e6da4; + color: white;*/ + font-weight: bold; +} + +.answer { + background-color: #eee; + cursor: pointer; + padding: 1em; +} + +.answer:hover { + background-color: #ccc; +} + +body { + font-family: sans-serif; + text-align: center; +} + +table { + border-collapse: collapse; + max-width: 100%; + margin: 0 auto; +} + +tr, td { + border: 1px solid black; + padding: 3px; +} + +.form-box { + display: flex; + flex-direction: row; +} + +.form-solution { + flex-grow: 0; + width: 0; + margin-right: 0.5em +} + +.form-answer { + flex-grow: 1 +}