Welcome to the Virtual Keyboard project! This project provides a simple web-based virtual keyboard that allows users to input text using both the physical keyboard and on-screen keyboard clicks. The project is built using HTML, CSS, and JavaScript.
Documentation + Explanation of developing this project from scratch.
This project has been developed by Mizbaul Haque Maruf, OpenGenus intern.
Demo:
-
Responsive Layout: The virtual keyboard is designed with a responsive layout that adjusts to different screen sizes.
-
Text Display: A text container displays the entered text, with a cursor indicator to show the typing position.
-
Physical Keyboard Input: Users can type using their physical keyboard. Key presses including Backspace, Enter, and alphanumeric characters are supported.
-
On-Screen Keyboard Input: Users can also click on the virtual keyboard keys to input characters.
-
Backspace, Enter, and Space Keys: Special keys provide functionality for deleting characters, adding newlines, and inserting spaces.
-
CapsLock Key: The CapsLock key toggles capitalization for entered characters.
-
Typing Differentiation: The system can differentiate between typing using the physical keyboard and typing through the on-screen keyboard.
-
Clone the repository to your local machine.
-
Open the project's main HTML file (
index.html) in a web browser. -
Use your physical keyboard or the on-screen keyboard to input text. Clicking on the keys with your mouse will also input characters.
-
Experiment with different keys, including Backspace, Enter, Space, and CapsLock, to explore the keyboard's functionality.
Contributions are welcome! If you'd like to enhance this project, please follow these steps:
-
Fork the repository.
-
Create a new branch for your feature or bug fix.
-
Make your changes and commit them.
-
Push your changes to your forked repository.
-
Submit a pull request to the main repository.
- Font Awesome for providing the icon library.