https://github.com/prathameshdhande22/virtual-keyboard-html

Created Virtual Keyboard using HTML,CSS,JavaScript and Bootstrap, Support only for Desktop view not for Mobile
https://github.com/prathameshdhande22/virtual-keyboard-html

alphabets bootstrap bootstrap5 css css3 html html-css-javascript html5 javascript numbers project virtualkeyboard

Last synced: about 1 month ago
JSON representation

Created Virtual Keyboard using HTML,CSS,JavaScript and Bootstrap, Support only for Desktop view not for Mobile

• Host: GitHub
• URL: https://github.com/prathameshdhande22/virtual-keyboard-html
• Owner: PrathameshDhande22
• Created: 2023-06-05T16:58:11.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2023-06-06T05:21:14.000Z (almost 3 years ago)
• Last Synced: 2025-12-07T15:08:01.805Z (6 months ago)
• Topics: alphabets, bootstrap, bootstrap5, css, css3, html, html-css-javascript, html5, javascript, numbers, project, virtualkeyboard
• Language: HTML
• Homepage: https://prathameshdhande22.github.io/Virtual-KeyBoard-HTML/
• Size: 10.7 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Support: support.html

Awesome Lists containing this project

README

          
# Virtual Keyboard using HTML, CSS and JavaScript

This repository contains a virtual keyboard web application created using HTML, CSS, JavaScript, and Bootstrap. The virtual keyboard is designed for desktop use and provides a user-friendly interface for typing.

## Features

- Full keyboard layout with alphabetical, numerical, and special characters.

- Caps Lock functionality to toggle uppercase letters.

- Shift key to temporarily enable uppercase letters.

- Space bar for entering spaces between words.

- Bootstrap support for tooltips and toasts, enhancing the user experience.

## Usage

To use the virtual keyboard, follow these steps:

1. Clone the repository: `git clone https://github.com/prathameshdhande22/virtual-keyboard.git`

2. Navigate to the project directory: `cd virtual-keyboard`

3. Open the `index.html` file in your web browser.

4. Click on the keys with your mouse or use your physical keyboard to enter characters.

5. The keyboard layout follows the standard QWERTY layout.

### Functionality

- Clicking the `Caps Lock` button will toggle uppercase letters. When active, all entered letters will be in uppercase until deactivated.

- Clicking the `Shift` button will temporarily enable uppercase letters for the next character typed.

- Clicking the `Space` button will enter a space character between words.

## Technologies Used

- HTML

- CSS

- JavaScript

- Bootstrap

## ScreenShots

1. Typing on Virtual Keyboard using Shift button on.

![Screenshot 2023-06-05 225519](https://github.com/PrathameshDhande22/Virtual-KeyBoard-HTML/assets/87264935/e90195f2-0a47-44a0-ab8d-d2ce7ec6473a)

2. Typing on Virtual Keyboard using Shift button off.

![Screenshot 2023-06-05 225533](https://github.com/PrathameshDhande22/Virtual-KeyBoard-HTML/assets/87264935/8c3c85f6-f6d3-469a-8a20-4bd83cf5eaae)

3. Copying the Text typed using Virtual Keyboard.

![Screenshot 2023-06-05 225548](https://github.com/PrathameshDhande22/Virtual-KeyBoard-HTML/assets/87264935/6dae8f70-4e75-43bd-b42d-e1a766550189)

## Author

This virtual keyboard was created by Prathamesh Dhande.

## License

This project is open source and does not have any specific license. Feel free to use and modify the code as per your requirements.

## Acknowledgments

Special thanks to the Bootstrap framework for providing the tooltip and toast components, enhancing the usability of the virtual keyboard.