Virtual Keyboard Playground

https://github.com/Mottie/Keyboard

HTML

<link rel="stylesheet" href="http://mottie.github.com/Keyboard/css/keyboard.css">
<script src="http://mottie.github.com/Keyboard/js/jquery.keyboard.js"></script>
<script src="http://mottie.github.com/Keyboard/js/jquery.mousewheel.js"></script>
<script src="http://mottie.github.com/Keyboard/js/jquery.keyboard.extension-typing.js"></script>
<script src="http://mottie.github.com/Keyboard/js/jquery.keyboard.extension-autocomplete.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css">
<div id="display">&nbsp;</div>

<div id="wrap">
    <input id="keyboard" type="text">
</div>

CSS

#wrap { margin: 100px; }

JavaScript

$('#keyboard').keyboard({
    
    // keyboard visible callback
    visible : function(e, keyboard, el) {
        // ignore code if already applied
        if (!keyboard.$keyboard.hasClass('bound')) {
            keyboard.$keyboard
                .addClass('bound') // prevent multiple binds
                .find('.ui-keyboard-bksp') // bksp key class
                .bind('click', function(e){
                    // update display with message + time
                    $('#display').html('bksp clicked: ' + e.timeStamp);
                });
        }
    }

});