Salve ragazzi, ho bisogno di una mano...possiedo una tastiera virtuale, ecco i codici:

codice HTML:
<form action="" method="post" id="loginform">
    <label for="username">Username:</label>
    <input type="text" name="username" id="username" />
    
    <label for="pwd">Password:</label>
    <input type="text" name="pwd" id="pwd"/>
    
    
</form>
<input class="tastiera" type="button" id="showkeyboard" onclick="change()" value="Apri
Tastiera">
</div>
<div id="keyboard">
    <div class="wrapper" id="row0">
        <input class="box" name="accent" type="button" value="`" />
        <input class="box" name="1" type="button" value="1" />
        <input class="box" name="2" type="button" value="2" />
        <input class="box" name="3" type="button" value="3" />
        <input class="box" name="4" type="button" value="4" />
        <input class="box" name="5" type="button" value="5" />
        <input class="box" name="6" type="button" value="6" />
        <input class="box" name="7" type="button" value="7" />
        <input class="box" name="8" type="button" value="8" />
        <input class="box" name="9" type="button" value="9" />
        <input class="box" name="0" type="button" value="0" />
        <input class="box" name="-" type="button" value="-" />
        <input class="box" name="=" type="button" value="=" />
        <input class="box1" name="backspace" type="button" value="Cancella" />
    </div>
    
    <div class="wrapper" id="row0_shift">
        <input class="box" name="tilde" type="button" value="~" />
        <input class="box" name="exc" type="button" value="!" />
        <input class="box" name="at" type="button" value="@" />
        <input class="box" name="hash" type="button" value="#" />
        <input class="box" name="dollar" type="button" value="$" />
        <input class="box" name="percent" type="button" value="%" />
        <input class="box" name="caret" type="button" value="^" />
        <input class="box" name="ampersand" type="button" value="&" />
        <input class="box" name="asterik" type="button" value="*" />
        <input class="box" name="openbracket" type="button" value="(" />
        <input class="box" name="closebracket" type="button" value=")" />
        <input class="box" name="underscore" type="button" value="_" />
        <input class="box" name="plus" type="button" value="+" />
        <input class="box1" name="backspace" type="button" value="Cancella" />
    </div>
    
    <div class="wrapper" id="row1">
        <input class="box" name="q" type="button" value="q" />
        <input class="box" name="w" type="button" value="w" />
        <input class="box" name="e" type="button" value="e" />
        <input class="box" name="r" type="button" value="r" />
        <input class="box" name="t" type="button" value="t" />
        <input class="box" name="y" type="button" value="y" />
        <input class="box" name="u" type="button" value="u" />
        <input class="box" name="i" type="button" value="i" />
        <input class="box" name="o" type="button" value="o" />
        <input class="box" name="p" type="button" value="p" />
        <input class="box" name="[" type="button" value="[" />
        <input class="box" name="]" type="button" value="]" />
        <input class="box" name="\" type="button" value="\" />
    </div>
    
    <div class="wrapper" id="row1_shift">
        <input class="box" name="Q" type="button" value="Q" />
        <input class="box" name="W" type="button" value="W" />
        <input class="box" name="E" type="button" value="E" />
        <input class="box" name="R" type="button" value="R" />
        <input class="box" name="T" type="button" value="T" />
        <input class="box" name="Y" type="button" value="Y" />
        <input class="box" name="U" type="button" value="U" />
        <input class="box" name="I" type="button" value="I" />
        <input class="box" name="O" type="button" value="O" />
        <input class="box" name="P" type="button" value="P" />
        <input class="box" name="{" type="button" value="{" />
        <input class="box" name="}" type="button" value="}" />
        <input class="box" name="|" type="button" value="|" />
    </div>
    
    <div class="wrapper" id="row2">
        <input class="box" name="a" type="button" value="a" />
        <input class="box" name="s" type="button" value="s" />
        <input class="box" name="d" type="button" value="d" />
        <input class="box" name="f" type="button" value="f" />
        <input class="box" name="g" type="button" value="g" />
        <input class="box" name="h" type="button" value="h" />
        <input class="box" name="j" type="button" value="j" />
        <input class="box" name="k" type="button" value="k" />
        <input class="box" name="l" type="button" value="l" />
        <input class="box" name=";" type="button" value=";" />
        <input class="box" name="'" type="button" value="'" />   
    </div>
    
    <div class="wrapper" id="row2_shift">
        <input class="box" name="a" type="button" value="A" />
        <input class="box" name="s" type="button" value="S" />
        <input class="box" name="d" type="button" value="D" />
        <input class="box" name="f" type="button" value="F" />
        <input class="box" name="g" type="button" value="G" />
        <input class="box" name="h" type="button" value="H" />
        <input class="box" name="j" type="button" value="J" />
        <input class="box" name="k" type="button" value="K" />
        <input class="box" name="l" type="button" value="L" />
        <input class="box" name=";" type="button" value=":" />
        <input class="box" name="'" type="button" value='"' />
    </div>
    
    <div class="wrapper" id="row3">
        <input class="box" name="Shift" type="button" value="Maiusc" id="shift" />
        <input id="row3c" class="box" name="z" type="button" value="z" />
        <input id="row3c" class="box" name="x" type="button" value="x" />
        <input id="row3c" class="box" name="c" type="button" value="c" />
        <input id="row3c" class="box" name="v" type="button" value="v" />
        <input id="row3c" class="box" name="b" type="button" value="b" />
        <input id="row3c" class="box" name="n" type="button" value="n" />
        <input id="row3c" class="box" name="m" type="button" value="m" />
        <input id="row3c" class="box" name="," type="button" value="," />
        <input id="row3c" class="box" name="." type="button" value="." />
        <input id="row3c" class="box" name="/" type="button" value="/" />
    </div>
    
    <div class="wrapper" id="row3_shift">
        <input class="box" name="Shift" type="button" value="Maiusc" id="shifton" />
        <input class="box" name="Z" type="button" value="Z" />
        <input class="box" name="X" type="button" value="X" />
        <input class="box" name="C" type="button" value="C" />
        <input class="box" name="V" type="button" value="V" />
        <input class="box" name="B" type="button" value="B" />
        <input class="box" name="N" type="button" value="N" />
        <input class="box" name="M" type="button" value="M" />
        <input class="box" name="lt" type="button" value="&lt;" />
        <input class="box" name="gt" type="button" value="&gt;" />
        <input class="box" name="?" type="button" value="?" />
    </div>
    <div class="wrapper" id="spacebar">
        <input class="box" name="Spazio" type="button" value="&nbsp;" />
    </div>
    
</div>
</center>


<script type="text/javascript" src="Serpinter/tast/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="Serpinter/tast/jquery-ui-personalized-1.5.2.min.js"></script>
<script type="text/javascript" src="Serpinter/tast/jquery-fieldselection.js"></script>

<script type="text/javascript" src="Serpinter/tast/vkeyboard.js"></script>