2012-01-06 10 views
9

Tenemos una aplicación para un sistema integrado, y estamos desarrollando varias aplicaciones basadas en HTML5, CSS3 y algunas bibliotecas JS, que se ejecutan en un navegador webkit. Me preguntaba si hay alguna biblioteca implementada en el teclado de pantalla con gráficos de teclas personalizables. También debería ser fácil internacionalizarlo.JS Teclado basado en pantalla para navegador, como en teléfonos celulares y tabletas

¿Puede haber algo basado en el lienzo HTML5?

Agradezco cualquier aportación. ¡Gracias!

Respuesta

8
+1

Me gusta el nettuts uno. Vi jquery4u, pero no me gustó porque estaba basado en jquery ui. ¿Conoces alguno basado en el lienzo html5? – Sherzod

+0

Esto podría funcionar: http://stickmanventures.com/labs/demo/onscreen-keyboard-html5-canvas-multitouch/ - más información aquí: http://blog.stickmanventures.com/2011/10/22/onscreen -keyboard-implementado-en-html5-canvas-con-multitouch-soporte-a-touch-eventos-api-y-magictouch-js/ –

+0

@Grillz Interesante demostración, aunque en mi teléfono en Mobile Firefox dice "No lo hagas" Parece que tiene soporte multitáctil en el escritorio. Necesita algo de TUIO "... lo cual es extraño, ya que no estoy en un dispositivo de escritorio, estoy en un dispositivo de pantalla multitáctil. – Michael

6

puede probar con el Virtual Keyboard que tiene una gran cantidad de features, language layouts y es muy well documented.
También puede integrar fácilmente con archivos de inicio:

$('#keyboard').keyboard({ 
    layout: 'qwerty', 
    css: { 
     // input & preview 
     input: 'form-control input-sm', 
     // keyboard container 
     container: 'center-block dropdown-menu', // jumbotron 
     // default state 
     buttonDefault: 'btn btn-default', 
     // hovered button 
     buttonHover: 'btn-primary', 
     // Action keys (e.g. Accept, Cancel, Tab, etc); 
     // this replaces "actionClass" option 
     buttonAction: 'active', 
     // used when disabling the decimal button {dec} 
     // when a decimal exists in the input area 
     buttonDisabled: 'disabled' 
    } 
}) 

Encuentra el ejemplo completo here.

También podría probar el On Screen Keyboard que es mucho más simple y menos rico en características.

Cuestiones relacionadas