How to open emojis in HTML5 keypad?

Question

I want to know that in my code Whatsapp by Vansh . I want to open emojis in my keypad where I have made a sign of emoji but I don't know how to open it. please suggest me.
https://code.sololearn.com/W2F8n9S1A6HU/?ref=app

Answer 1

General solution to make it similar to the original app.

You can make a <div> that will keep your emoji inside, then set it as "display: none" and when the user click on the emoji icon you can show it by changing the display property to "display: block;"

You could put each emoji in a paragraph and assign the value of the clicked emoji at your text bar... the code will be approximately like code below.

In alternative, probably better and easier in terms of UX, you can just use some external stuff and allow jQuery to do the hard job for you, here an example: https://github.com/diy/jquery-emojiarea

https://code.sololearn.com/WLFfG3wVviXN/?ref=app

Answer 2

How can you claim this code as yours?

Answer 3

@#00FF00
I have made a lot new changes and I have also written here that made by Vansh inspired by Nikky.

Answer 4

thanks Maz