Spaces:
Running
Running
Update README.md
Browse files
README.md
CHANGED
|
@@ -9,4 +9,34 @@ license: mit
|
|
| 9 |
short_description: How HackerTyper.app Works
|
| 10 |
---
|
| 11 |
|
| 12 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 9 |
short_description: How HackerTyper.app Works
|
| 10 |
---
|
| 11 |
|
| 12 |
+
|
| 13 |
+
---
|
| 14 |
+
|
| 15 |
+
### 6. README.md for **hackertyper.app**
|
| 16 |
+
|
| 17 |
+
```markdown
|
| 18 |
+
# HackerTyper.app
|
| 19 |
+
|
| 20 |
+
A playful website that simulates hacker-style typing when any key is pressed.
|
| 21 |
+
|
| 22 |
+
## How it works
|
| 23 |
+
|
| 24 |
+
JavaScript listens to keydown events and reveals code character by character.
|
| 25 |
+
|
| 26 |
+
### Demo snippet
|
| 27 |
+
|
| 28 |
+
```html
|
| 29 |
+
<div id="screen" style="font-family: monospace; background: black; color: #0f0; padding: 1rem; height: 200px; overflow-y: auto;"></div>
|
| 30 |
+
|
| 31 |
+
<script>
|
| 32 |
+
const screen = document.getElementById('screen');
|
| 33 |
+
const code = "console.log('Hello Hacker!');\nfunction test() { return true; }\n";
|
| 34 |
+
let index = 0;
|
| 35 |
+
|
| 36 |
+
document.addEventListener('keydown', () => {
|
| 37 |
+
if (index < code.length) {
|
| 38 |
+
screen.textContent += code[index++];
|
| 39 |
+
screen.scrollTop = screen.scrollHeight;
|
| 40 |
+
}
|
| 41 |
+
});
|
| 42 |
+
</script>
|