Tester działania klawiatury

Nie naprawi Twojej klawiatury, ale można sprawdzić czy wszystkie klawisze działają lub gdzie jest problem.

Testowanie klawiatury pod kątem KEY CODE polega na sprawdzeniu, jakie kody są generowane przez poszczególne klawisze po ich naciśnięciu.
Każdy klawisz na klawiaturze ma przypisany unikalny kod (tzw. key code), który jest wysyłany do systemu operacyjnego po jego naciśnięciu.

Może pomóc zidentyfikować, czy problemy z klawiaturą są związane ze sprzętem, czy z oprogramowaniem.

Testowanie klawiatury online jest przydatne w przypadku:

Sprawdzenia nowej klawiatury po zakupie.
Diagnozowania problemów z działaniem klawiszy.
Upewnienia się, czy klawiatura nie ma uszkodzeń mechanicznych.

No i można ten gadżet wstawić na własną stronę.

Opis jak to zrobić jest poniżej.

Tester klawiatury

Naciśnij dowolny klawisz, aby rozpocząć

Jak wstawić gadżet na własną stronę?

Można to zrobić ręcznie lub pobrać gotowca i go edytować jak dusza zapragnie.

Tworzymy odpowiednie pliki:

index.html
style.css
script.js

index.html

<!DOCTYPE html>
<html lang="pl">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Wykrywanie klawiszy</title>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="result">Naciśnij dowolny klawisz, aby rozpocząć</div>
<script src="script.js"></script>
</body>
</html>

style.css

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}
body {
  height: 100vh;
}
#result {
  background-color: #242831;
  width: 80vw;
  max-width: 600px;
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  padding: 80px 40px;
  text-align: center;
  color: #f5f5f5;
  font-size: 3.6vmin;
  border-radius: 10px;
  box-shadow: 0 10px 50px rgba(0, 0, 0, 0.2);
  font-style: italic;
}
#result span:nth-child(1) {
  color: #2887e3;
  font-size: 3em;
  display: block;
  font-style: normal;
}
#result span:nth-child(2) {
  font-size: 1.5em;
  font-style: normal;
}

script.js

// www.skrip.pl
window.addEventListener("keydown", (e) => {
  document.getElementById(
    "result"
  ).innerHTML = `Naciśnięty klawisz to <span>${e.key}</span><span>Key Code: ${e.keyCode}</span>`;
});

Top Stories

Jak nie zostać ofiarą oszustów. Sposób na rozpoznanie fałszywego maila

Wangiri scam – jak nie zostać ofiarą

Statystyki wyszukiwarki PornHub za 2024 rok

Testowanie działania klawiatury

Nie naprawi Twojej klawiatury, ale można sprawdzić czy wszystkie klawisze działają