Ir para conteúdo
Fórum Script Brasil
  • 0

Teclado Virtual


Guest W-V

Pergunta

Estou precisando de algum SCRIPT que funcione como um teclado virtual.

Que funcione da seguinte maneira:

Ao clicar em uma letra, ela preenche a caixa de texto com a letra clicada.

http://www.oaviao.com/capture_Wiz/metar.php

>>>> Tem que ser alguma coisa do tipo de MAP BUTTON <<<<<

Ou alguma outra coisa que funcione sobre essa imagem.

Se alguém puder me ajudar.

Valeu

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0
Guest Visitante

Cara, mapeei a imagem, só que não estou conseguindo juntar o mapa com o teclado virtual.

Abaixo segue o código com a imagem mapeada, e mais abaixo o código do teclado.

IMAGEM MAPEADA

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
<table width="100" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><img name="AirMail" src="Air-Mail.jpg" width="555" height="1111" border="0" id="AirMail" usemap="#m_AirMail" alt="" />
      <map name="m_AirMail" id="m_AirMail">
        <area shape="rect" coords="473,978,536,994" href="#" alt="" />
        <area shape="rect" coords="473,820,534,835" href="#" alt="" />
        <area shape="rect" coords="472,340,536,357" href="#" alt="" />
        <area shape="rect" coords="473,663,538,679" href="#" alt="" />
        <area shape="rect" coords="473,496,536,514" href="#" alt="" />
      </map></td>
  </tr>
</table>
</body>
</html>
TECLADO VIRTUAL
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body><form name=form>
<input type=text name=frase><br>

<input type=button value='a' onclick="a(this.value)">
<input type=button value='b' onclick="a(this.value)">
<input type=button value='c' onclick="a(this.value)">
</form>

<script>
function a(letra){
document.form.frase.value+=letra; // Retire o sinal (+) e veja a diferença
}
</script>

</body>
</html>

valeu

Link para o comentário
Compartilhar em outros sites

  • 0
Guest Visitante

Cara...

não deu certo ainda, deve ser alguma coisa simples, mas eu não consegui descobrir.

Abaixo segue o código da página inteira, com a imagem e o botão recortado e o teclado.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body><form name=form>
  <br>
<table width="600" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><input type=text name=frase /></td>
  </tr>
  <tr>
    <td height="130"><img name="area_btn" src="area_btn.jpg" width="666" height="241" border="0" id="area_btn" usemap="#m_area_btn" alt="" />
      <map name="m_area_btn" id="m_area_btn">
        <area shape="rect" coords="205,93,407,145" href="java script:" onclick="a" value='a' alt="" />
      </map></td>
  </tr>
  <tr>
    <td><input name="button" type="button" onclick="a(this.value)" value='b' />
      <input name="button" type="button" onclick="a(this.value)" value='c' /></td>
  </tr>
</table>
</form>

<script>
function a(letra){
document.form.frase.value+=letra; // Retire o sinal (+) e veja a diferença
}
</script>

</body>
</html>

É só fazer com que ao clicar no BOTAÕ funcione como teclado virtual.

Valeu galera.

Abs

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,2k
    • Posts
      651,9k
×
×
  • Criar Novo...