mouseevent - Create a model window for comment in javascript -

i created comment button. want when user click on button model window open. model window should contain keyboard writing comment.

this might little bit. can't code entire keyboard you.

html:

<input type="button" value="show keyboard!"> <!-- button --> <div id="wrapper"> <!-- keyboard --> <!-- type code here, make sure it's css textarea below, display:none;. copy-paste jquery line says 'textarea', , change 'textarea' whatever element added. --> <textarea></textarea> </div> 

css:

#wrapper {     position:relative;     margin-top:30px;     background-color:#ccc;     width:400px;     height:0px; }  textarea {     display:none;     margin:0 auto;     width:200px;     height:160px; } 

jquery:

$(document).ready(function() {    $('input').click(function() { // when button clicked...         $('#wrapper').animate({ height: '+=200px'},100);         // ...increase height of wrapper 200px         $('textarea').css({ 'display': 'block'});         // ...make sure textarea visible    }) }); 

link jsfiddle: http://jsfiddle.net/16fuhf6r/3/ comments code explanation included.