Morrisson
-
Posts
1 -
Joined
-
Last visited
Morrisson's Achievements
Level 1 (1/20)
1
Reputation
-
JasonHaywood reacted to a post in a topic:
Courses Knowledge Check Quizzes
-
Courses Knowledge Check Quizzes
Morrisson replied to MountainLeprechaun's topic in Paywalls and digital products
I added a "code" block and used this simple HTML code to add quizzes to my pages: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Quizlet</title> <style> body { font-family: Arial, sans-serif; } .quiz-container { max-width: 600px; margin: 0 auto; padding: 20px; border: 1px solid #ddd; border-radius: 5px; } .question { font-size: 1.2em; margin-bottom: 20px; } .answer { display: flex; align-items: center; margin-bottom: 10px; cursor: pointer; } .answer input[type="radio"] { margin-right: 10px; } .correct { display: none; margin-left: 10px; color: green; font-weight: bold; } </style> </head> <body> <div class="quiz-container"> <div class="question">What is a chord in music?</div> <div class="answer"> <input type="radio" name="answer" value="wrong" id="answer1"> <label for="answer1">A single musical note played repeatedly</label> <span class="correct" id="correct1">✔</span> </div> <div class="answer"> <input type="radio" name="answer" value="wrong" id="answer2"> <label for="answer2">Two musical notes played one after the other</label> <span class="correct" id="correct2">✔</span> </div> <div class="answer"> <input type="radio" name="answer" value="correct" id="answer3"> <label for="answer3">A combination of three or more different musical notes played simultaneously</label> <span class="correct" id="correct3">✔</span> </div> </div> <script> document.querySelectorAll('input[type="radio"]').forEach(radio => { radio.addEventListener('change', function() { if (this.value === 'correct') { document.getElementById('correct3').style.display = 'inline'; } else { document.getElementById('correct3').style.display = 'none'; } }); }); </script> </body> </html>- 6 replies
-
- 1
-
-
- form
- squarespace-7.1
- (and 1 more)
