Make keyboard appear in mobile browser

So i refactored my project code so it look proper for phone browser, i made space for a keyboard to appear, but i still don’t know how.
After a little research on google, stackoverflow says that browsers are built to prevent keyboard to appear because it bothers people. Is this true?
Any hint on how to make it appear when page is open, or at a function execution?
Thank you.

Usually, the keyboard will appear automatically when the user puts focus on an interactive element that needs keyboard input, so there is nothing you need to do to get it to appear. Can you explain a little more exactly what you are trying to do? Perhaps a link to your project?

So the project is couple rows made of squared divs when if key.event is triggered the letter that was pushed appear on the the first div(square) of the row then the other and so on… They are not input fields just divs that get typed letters from an object somewhere and made to appear on those rows.
Works fine on the computer and real keyboard but needs a virtual keyboard to appear in phone browser.
Demo’s Link to the project

I think all of those boxes need to be actual <input>s. The only way you can use this right now is with a mouse. People who are using only the keyboard and touch screen users can’t enter letters. If you make those boxes inputs then not only will the virtual keyboard for touch screen users pop-up but keyboard-only users will be able to Tab into them and enter letters as well. This has the added benefit of making it accessible for a wider range of people.

2 Likes