Dynamic Table Viewer
About this app
A colorful and interactive web app for visualizing data in various tabular formats.
Fun Quiz Application Fun Quiz
Related apps
IPTV M3U8 & EPG Generator Studio | Image to M3U Playlist & Guide
Image to IPTV Converter & M3U Playlist Generator
Image to IPTV Converter & M3U Playlist Generator
Image to M3U Playlist Converter | IPTV & Media Stream Generator
Roulette Row Predictor Pro - Live Pattern & Trend Stats Analyzer
Video to Repeated Sequence Generator - Rhythm & Glitch Loop Maker
LoopCraft - Video to Repeated Sequence Converter
LoopMatrix - Video Sequence Repeater & Stutter Maker
MuffleFX - Video & Audio Low-Pass Filter Studio
Seeding Rate Calculator
Irrigation Set Time Calculator
Fertilizer Nutrient Units Calculator
Put this on your site
Source
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Fun Quiz Application</title>
<meta name="description" content="An interactive and colorful quiz application to test your knowledge with fun questions.">
<meta name="keywords" content="quiz, trivia, interactive, fun">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Roboto', sans-serif;
background: linear-gradient(to top right, #ff9a00, #ff6f00);
color: #fff;
text-align: center;
}
h1 {
margin: 20px 0;
}
.quiz-container {
margin: 40px auto;
padding: 20px;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 8px;
}
.question {
font-size: 24px;
margin: 20px 0;
}
.options button {
margin: 10px;
padding: 10px 20px;
font-size: 18px;
border: none;
border-radius: 5px;
cursor: pointer;
background-color: rgba(0, 100, 200, 0.8);
color: white;
transition: background-color 0.3s;
}
.options button:hover {
background-color: rgba(0, 100, 200, 1);
}
.result {
margin-top: 20px;
font-size: 20px;
}
</style>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
const quizData = [
{
question: "What is the capital of France?",
options: ["Berlin", "Madrid", "Paris", "Lisbon"],
answer: 2
},
{
question: "Which planet is known as the Red Planet?",
options: ["Earth", "Jupiter", "Mars", "Saturn"],
answer: 2
},
];
let currentQuestion = 0;
let score = 0;
function loadQuestion() {
const questionElement = document.getElementById('question');
const optionsContainer = document.getElementById('options');
questionElement.textContent = quizData[currentQuestion].question;
optionsContainer.innerHTML = '';
quizData[currentQuestion].options.forEach((option, index) => {
const button = document.createElement('button');
button.textContent = option;
button.onclick = () => checkAnswer(index);
optionsContainer.appendChild(button);
});
}
function checkAnswer(answerIndex) {
if (answerIndex === quizData[currentQuestion].answer) {
score++;
}
currentQuestion++;
if (currentQuestion < quizData.length) {
loadQuestion();
} else {
showResults();
}
}
function showResults() {
const quizContainer = document.getElementById('quiz-container');
quizContainer.innerHTML = `
<h2>Your Score: ${score} / ${quizData.length}</h2>
<p>Thank you for playing!</p>`;
}
loadQuestion();
});
</script>
</head>
<body>
<div class="quiz-container" id="quiz-container">
<h1>Fun Quiz</h1>
<div class="question" id="question"></div>
<div class="options" id="options"></div>
</div>
</body>
</html>
NEW APPS
These are apps made by the community!