CMT3 - Opdracht4
How do I make an cmt3 - opdracht4?
What is a cmt3 - opdracht4? How do you make a cmt3 - opdracht4? This script and codes were developed by Karlien Huygels on 29 October 2022, Saturday.
CMT3 - Opdracht4 - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CMT3 - Opdracht4</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <p></p>
</body> <script src="js/index.js"></script>
</body>
</html>
CMT3 - Opdracht4 - Script Codes CSS Codes
div { box-sizing: border-box; border: 1px solid black; width: 100px; height: 100px; float: left; margin-right: 10px; margin-bottom: 10px;}
div:nth-child(3), div:nth-child(6), div:nth-child(9) { margin-right: 0;
}
body { width: 320px; margin: 50px auto;}
.rood { background-color: red;}
p { display: inline; font-family: "helvetica neue"; color: darkgrey;}
CMT3 - Opdracht4 - Script Codes JS Codes
function main() { var vakjes = document.getElementsByTagName("div"); var aantal = document.getElementsByTagName("p")[0]; var teller = 1; var teller2 = 0; var i =0; vakjes[0].className = "rood"; aantal.innerHTML = teller; while(i < vakjes.length){ vakjes[i].onclick = function(){ if(this.className === "rood"){ if(teller < 9){ if(teller === 1){ vakjes[1].className = "rood"; vakjes[2].className = "rood"; teller = 3; } else if(teller === 3){ vakjes[3].className = "rood"; vakjes[4].className = "rood"; teller = 5; } else if(teller === 5){ vakjes[5].className = "rood"; vakjes[6].className = "rood"; teller = 7; } else if(teller === 7){ vakjes[7].className = "rood"; vakjes[8].className = "rood"; teller = 9; } } else if(teller === 9){ while(teller2 < vakjes.length){ vakjes[teller2].className = ""; teller2++; } teller2 = 0; teller = 1; vakjes[0].className ="rood"; } } aantal.innerHTML = teller; } i++; }
}
window.onload = function (){ main();
}
Developer | Karlien Huygels |
Username | KarlienHuygels |
Uploaded | October 29, 2022 |
Rating | 3 |
Size | 2,035 Kb |
Views | 8,096 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
CMT3 - Opdracht2 | 10,529 Kb |
CMT3 - Opdracht6 | 2,574 Kb |
IT3 - Opdracht9 | 7,019 Kb |
IT3 - Opdracht12 | 3,165 Kb |
CMT3 - Opdracht16 | 8,632 Kb |
IT3 - Opdracht6 | 7,888 Kb |
IT 3- Opdracht8 | 4,178 Kb |
CMT3 - Opdracht11 | 3,981 Kb |
CMT3 - Opdracht14 | 4,342 Kb |
CMT3 - Opdracht7 | 4,781 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Heatmap Color Scales | Stevepepple | 2,331 Kb |
Image grid with captions | Mchernin34 | 2,222 Kb |
Arrow Navigation | Hinducows | 1,973 Kb |
Wikipedia API | Coderpilot | 2,802 Kb |
Polygon Dodecahedron in CSS | Vennsoh | 7,606 Kb |
Mini Profile | Frytyler | 3,828 Kb |
Calculator - codevember 08 - 2016 | Caiocares | 3,260 Kb |
Apple website | Jds317 | 1,835 Kb |
Testing Code Pen | Jduprey | 1,468 Kb |
A Pen by Alex Bergin | Abergin | 3,347 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!