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

Clique Do Mouse Como Teclado Virtual


Guest - Wagner -

Pergunta

Guest - Wagner -

Olá,

se alguém poder me ajudar, agradeço desde já!

Estou precisando de algum SCRIPT que funcione como um TECLADO VIRTUAL.

Tenho a imagem de uma teclado, e como fazer um link para cada botão, e cada botão uma letra diferente, e que a mesma preencha o campode texto.

valeu

Link para o comentário
Compartilhar em outros sites

6 respostass a esta questão

Posts Recomendados

  • 0

Isso ajuda?

<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>

Link para o comentário
Compartilhar em outros sites

  • 0

opa! por curiosidade, fiz um teclado virtual aí, da uma olhada e vê se te dá uma luz de como você deve fazer

abraços

<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
.tecl{
border: #333399 1px Solid;
background: #ccffff;
font-size: 14px;
font-weight: bold;
}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
function envia(carac){
document.getElementById('campo').value += carac;
}
//-->
</script>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
quebra = 1;
document.write ('<table cellspacing="1" cellpadding="5"><tr>');
for (i=33; i<127; i++){
    document.write ('<td class="tecl" align="center" onclick="envia(this.innerText)">' + String.fromCharCode(i) + '</td>');
    if ((quebra == 32) || (quebra == 64)){
       document.write ('</tr><tr>');
   }
   quebra++;
} 
document.write ('</tr></table><br><br><br><br><br>');
document.write ('<input type="text" id="campo" />');
//-->
</script>
</body>
</html>

Link para o comentário
Compartilhar em outros sites

  • 0
Guest Visitante

Agradeço aos dois códigos que postaram....

só que se possível, gostaria de alguma outra maneira de fazer.

Ex: Tenho uma imagem de fundo, e nessa imagem está um teclado, mas como é uma imagem, não funciona o botão, logicamente.

Então, teria algum jeito de fazer esse teclado virtual com botões tipo aquele MAP para linkar imagens no DW?

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

A imagem está no link acima...

valeu galera

Link para o comentário
Compartilhar em outros sites

  • 0
Guest Visitante

abaixo segue o link da página que estou tentando colocar o teclado virtual, e mais abaixo o CODE da pag.

Se alguém puder me ajudar....

O esquema, seria ativar um teclado virtual sobre as teclas da imagem...

valeu

LINK:

http://www.oaviao.com/capture_Wiz/satelite.html

CODE:

<!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>..:: oaviao::..</title>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

#Layer1 {

position:absolute;

width:164px;

height:29px;

z-index:1;

left: 275px;

top: 166px;

}

#Layer2 {

position:absolute;

width:492px;

height:407px;

z-index:1;

left: 108px;

top: 71px;

}

.style11 {

color: #00FF00;

font-weight: bold;

}

.style13 {font-size: 20px; color: #00FF00;}

.style14 {

color: #00FF00;

font-family: Arial, Helvetica, sans-serif;

font-size: 20px;

}

.formulario {

font-family: Arial, Helvetica, sans-serif;

font-size: 13px;

font-weight: normal;

text-transform: uppercase;

color: #00FF00;

background-color: #000000;

border: 1px solid #00FF00;

}

-->

</style>

<script type="text/JavaScript">

<!--

function MM_openBrWindow(theURL,winName,features) { //v2.0

window.open(theURL,winName,features);

}

//-->

</script>

</head>

<body>

<table width="720" border="0" cellspacing="0" cellpadding="0">

<tr>

<td colspan="2"><img src="../images/CaptureWiz.jpg" width="716" height="1098" border="0" usemap="#Map" />

<div id="Layer2">

<table width="98%" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td colspan="2"><table width="93%" border="0" align="center" cellpadding="0" cellspacing="1">

<tr>

<td height="45" colspan="2" class="style14"><div align="center">IMAGENS DE SAT&Eacute;LITE</div></td>

</tr>

<tr>

<td height="66" class="style14">BRASIL - NE </td>

<td class="style14"><div align="right">AM. DO SUL </div></td>

</tr>

<tr>

<td height="44" class="style14">BRASIL - NW</td>

<td class="style14"><div align="right">&Aacute;SIA</div></td>

</tr>

<tr>

<td height="60" class="style14">BRASIL - SUL </td>

<td class="style14"><div align="right">EUROPA</div></td>

</tr>

<tr>

<td height="53" class="style14">&Aacute;FRICA</td>

<td class="style14"><div align="right">M&Eacute;XICO</div></td>

</tr>

<tr>

<td height="59" class="style14">AM. CENTRAL/ CARIBE </td>

<td class="style14"><div align="right">OCEANIA</div></td>

</tr>

<tr>

<td height="51" class="style14">AM. DO NORTE </td>

<td class="style14"><div align="right">TELA PRINCIPAL </div></td>

</tr>

</table></td>

</tr>

</table>

<div align="center"></div>

</div>

<map name="Map" id="Map">

<area shape="rect" coords="639,245,694,281" href="#" onclick="MM_openBrWindow('satelite/europa.html','Europa','width=720,height=486')" />

<area shape="rect" coords="21,299,76,335" href="#" onclick="MM_openBrWindow('satelite/africa.html','&Aacute;frica','width=720,height=486')" />

<area shape="rect" coords="639,190,694,226" href="#" onclick="MM_openBrWindow('satelite/asia.html','&Aacute;sia','width=720,height=486')" />

<area shape="rect" coords="637,360,692,396" href="#" onclick="MM_openBrWindow('satelite/oceania.html','Oceania','width=720,height=486')" />

<area shape="rect" coords="88,536,155,578" href="metar.php" />

<area shape="rect" coords="168,536,237,578" href="taf_9h.php" />

<area shape="rect" coords="251,536,319,578" href="taf_18h.php" />

<area shape="rect" coords="637,414,695,452" href="capture_wiz.html" />

<area shape="rect" coords="86,592,154,639" href="ventos.html" />

<area shape="rect" coords="638,302,693,338" href="#" onclick="MM_openBrWindow('satelite/mexico.html','M&eacute;xico','width=720,height=486')" />

<area shape="rect" coords="22,244,79,280" href="#" onclick="MM_openBrWindow('satelite/brasil_sul.html','SulBr','width=720,height=486')" />

<area shape="rect" coords="22,132,79,168" href="#" onclick="MM_openBrWindow('satelite/brasil_ne.html','NeBr','width=720,height=486')" />

<area shape="rect" coords="21,188,78,224" href="#" onclick="MM_openBrWindow('satelite/brasil_nw.html','BrnW','width=720,height=486')" />

<area shape="rect" coords="637,135,695,171" href="#" onclick="MM_openBrWindow('satelite/am_sul.html','AmSul','width=720,height=486')" />

<area shape="rect" coords="20,356,75,392" href="#" onclick="MM_openBrWindow('satelite/am_central.html','Central','width=720,height=486')" />

<area shape="rect" coords="21,413,78,449" href="#" onclick="MM_openBrWindow('satelite/am_norte.html','AmNorte','width=720,height=486')" />

<area shape="rect" coords="335,537,404,579" href="#" />

<area shape="rect" coords="416,535,487,579" href="#" />

</map></td>

</tr>

</table>

</body>

</html>

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...