diff options
| author | Saksham Mittal <gotlouemail@gmail.com> | 2022-04-02 18:58:42 +0530 |
|---|---|---|
| committer | Saksham Mittal <gotlouemail@gmail.com> | 2022-04-02 18:58:42 +0530 |
| commit | fda6bdf1ebf59f1f86f122186ba726c1e83881f7 (patch) | |
| tree | 0f2e50f15ce9a04224b8a2cf174d0cf205f3b45b | |
| download | purple-fda6bdf1ebf59f1f86f122186ba726c1e83881f7.tar.gz | |
Initial commit
Basic webpage is setup with the ability to print the 5 letter word that a user types into the text box
| -rw-r--r-- | index.html | 16 | ||||
| -rw-r--r-- | script.js | 14 | ||||
| -rw-r--r-- | style.css | 11 |
3 files changed, 41 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..5438389 --- /dev/null +++ b/index.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> + +<html lang="en"> + <head> + <title>Guessing Game</title> + <script src="script.js" defer></script> + <link href="style.css" rel="stylesheet"> + </head> + <body> + <h1>Guessing Game</h1> + <form onsubmit="hello(event)"> + <input type="text" placeholder="Guess" autofocus> + </form> + <p id="result"></p> + </body> +</html> diff --git a/script.js b/script.js new file mode 100644 index 0000000..5f3ad23 --- /dev/null +++ b/script.js @@ -0,0 +1,14 @@ +let answer = "hello"; +let form = document.querySelector('form'); + +let input = document.querySelector('input'); + +function hello(event) { + event.preventDefault(); + let name = document.querySelector('#result'); + if (input.value.length == 5) { + name.innerHTML = `${input.value}`; + } else { + name.innerHTML = ""; + } +} diff --git a/style.css b/style.css new file mode 100644 index 0000000..70d56db --- /dev/null +++ b/style.css @@ -0,0 +1,11 @@ +body { + background-color: #000000; + color: #ffffff; + font-family: sans-serif; + text-align: center; +} + +input { + background: #000000; + color: #ffffff; +} |