Files
JavaScript-from-Beginner-to…/Chapter 11/Exercise_11.4.html
T
2021-11-30 19:08:37 +05:30

33 lines
936 B
HTML
Vendored

<!doctype html>
<html>
<head>
<title>JS Tester</title>
</head>
<body>
<div class="output"></div>
<script>
const output = document.querySelector(".output");
output.textContent = "hello world";
output.style.height = "200px";
output.style.width = "400px";
output.style.backgroundColor = "red";
output.addEventListener("mousedown", function (e) {
message("green", e);
})
output.addEventListener("mouseover", function (e) {
message("red", e);
})
output.addEventListener("mouseout", function (e) {
message("yellow", e);
})
output.addEventListener("mouseup", function (e) {
message("blue", e);
})
function message(elColor, event) {
console.log(event.type);
output.style.backgroundColor = elColor;
}
</script>
</body>
</html>