Customize jQuery On-Screen Keyboard

0 votes

enter image description here

I need to display a virtual keyboard in some pages on my web-app, so I found this beautiful jQuery On-Screen Keyboard:You can download it from Github: https://github.com/sdeering/onscreenkeyboard/archive/master.zip

I need help to customize it, initially I thought that change CSS will do but turn out it need to be changed on some Jquery functions, I tried removing and changing the order of some functions but didn't work, I dont know Jquery so I am stuck.

For example here are some modifications I need to archive:

  • Display upper key by default (right now it displays lower key) and don't give them the option key to turn on lower key.
  • Remove Enter key

Can someone help me to figure out those 2 modifications above and give a brief explanation so I can get started and understand how to customize a key, I need a lot of modifications.

Jul 25, 2022 in Web Development by gaurav
• 23,260 points
1,229 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
0 votes

Add this code to your HTML document (AFTER it loads jquery, which it does on line 113) What this does is run the changeToCapitalLetter function, which will change the keyboard to the capital keys.

<script> $(document).ready(function() { jsKeyboard.changeToCapitalLetter(); }); </script>

Remove Enter key and don't give them the option key to turn on lower key.

replace lines 177 and 179 with the following code

{ value: "", isChar: "false", buttonClass: "button button_empty", keyClass: "key key_empty" },
answered Jul 26, 2022 by rajatha
• 7,680 points

edited Mar 5

Related Questions In Web Development

0 votes
0 answers
0 votes
1 answer

Date range picker on jquery ui datepicker

Thanks I need this kind of code. ...READ MORE

answered Jun 27, 2022 in Web Development by rajatha
• 7,680 points
5,094 views
0 votes
1 answer

Why use jQuery on() instead of click()

The . on() method attaches event handlers to ...READ MORE

answered Jun 27, 2022 in Web Development by rajatha
• 7,680 points
524 views
0 votes
1 answer

How to Fade In/Out multiple texts using CSS/jQuery like on Droplr?

The jQuery fadeIn() method is used to ...READ MORE

answered Jun 29, 2022 in Web Development by rajatha
• 7,680 points
1,599 views
0 votes
0 answers

scroll up and down a div on button click using jquery

I am trying to add a feature ...READ MORE

Jun 29, 2022 in Web Development by gaurav
• 23,260 points
8,439 views
0 votes
0 answers

how to trigger on jquery.smart wizard Finish button?

Iam very new in jquery. here is ...READ MORE

Jul 19, 2022 in Web Development by gaurav
• 23,260 points
2,840 views
0 votes
1 answer

What is jQuery?

Hey, jQuery is a fast and concise JavaScript ...READ MORE

answered Feb 14, 2020 in JQuery by kartik
• 37,520 points
1,543 views
0 votes
1 answer

Uncaught TypeError: Cannot read property 'msie' of undefined - jQuery tools

Hello, Use the following script tag in your ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
16,511 views
0 votes
1 answer

Uncaught Error: Bootstrap's JavaScript requires jQuery

Hello @kartik, You have provided wrong order for ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
23,796 views
0 votes
1 answer

How to make Bootstrap popover Appear/Disappear on hover instead of click?

Hello @kartik, Set the trigger option of the popover to hover instead ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
3,538 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP