quinta-feira, 3 de novembro de 2011

5 buscadores com tons diferentes e com reconhecimento de voz

Há uns dias atrás postei aqui no cblogger um buscador avançado, que por sua vez tinha como novidade o reconhecimento de voz. Porém, o buscador era simples, mas ao final falei que iria postar outros com a mesma funcionalidade, só que personalizado. Pois bem, aqui estou postando pra vocês 5 buscadores com mesmo estilo, mas com cores diferentes.

Como dito na postagem do buscador com reconhecimento de voz simples, este, muda apenas o estilo, mas a funcionalidade continua a mesma, deixando seu blog com um buscador mais elaborado e divertido ao mesmo tempo. Vamos colocar em seu blog? É fácil, veja:

1. Faça o login no blogger.

2. Acesse a guia “Layout” –> “Adicionar um gadget” e clique na opção “HTML/Javascript”.

3. Agora cole um dos códigos abaixo conforme seu gosto. Depois salve.

Buscador 1

<style>
.botprocura1 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 35px;
background-position-x: -181px;
width: 45px;
cursor: pointer;
float: right;
}

.botprocura1:hover {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
background-position-x: -413px;
}

.caixadetexto1 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 34px;
width: 160px;
padding-right: 9px;
padding-left: 10px;
}

.acaixaproc1 {
width: 227px;
}

</style>

<form method="get" class="acaixaproc1" action="/search"><input type="text"  class="caixadetexto1" name="q" size="30" x-webkit-speech/>
<input type="submit" class="botprocura1" value=""/></form>

Buscador2

<style>
.botprocura2 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 35px;
background-position-x: -181px;
background-position-y: -35px;
width: 45px;
cursor: pointer;
float: right;
}

.botprocura2:hover {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
background-position-x: -413px;
background-position-y: -35px;
}

.caixadetexto2 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 34px;
width: 160px;
padding-right: 9px;
padding-left: 10px;
}

.acaixaproc2 {
width: 227px;
}

</style>

<form method="get" class="acaixaproc2" action="/search"><input type="text"  class="caixadetexto2" name="q" size="30" x-webkit-speech/>
<input type="submit" class="botprocura2" value=""/></form>

Buscador 3

<style>
.botprocura3 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 35px;
background-position-x: -181px;
background-position-y: -70px;
width: 45px;
cursor: pointer;
float: right;
}

.botprocura3:hover {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
background-position-x: -413px;
background-position-y: -70px;
}

.caixadetexto3 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 34px;
width: 160px;
padding-right: 9px;
padding-left: 10px;
}

.acaixaproc3 {
width: 227px;
}

</style>

<form method="get" class="acaixaproc3" action="/search"><input type="text"  class="caixadetexto3" name="q" size="30" x-webkit-speech/>
<input type="submit" class="botprocura3" value=""/></form>

Buscador 4

<style>
.botprocura4 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 35px;
background-position-x: -181px;
background-position-y: -105px;
width: 45px;
cursor: pointer;
float: right;
}

.botprocura4:hover {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
background-position-x: -413px;
background-position-y: -105px;
}

.caixadetexto4 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 34px;
width: 160px;
padding-right: 9px;
padding-left: 10px;
}

.acaixaproc4 {
width: 227px;
}

</style>

<form method="get" class="acaixaproc4" action="/search"><input type="text"  class="caixadetexto4" name="q" size="30" x-webkit-speech/>
<input type="submit" class="botprocura4" value=""/></form>

Buscador 5

<style>
.botprocura5 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 35px;
background-position-x: -181px;
background-position-y: -140px;
width: 45px;
cursor: pointer;
float: right;
}

.botprocura5:hover {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
background-position-x: -413px;
background-position-y: -140px;
}

.caixadetexto5 {
background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png);
border: none;
height: 34px;
width: 160px;
padding-right: 9px;
padding-left: 10px;
}

.acaixaproc5 {
width: 227px;
}

</style>

<form method="get" class="acaixaproc5" action="/search"><input type="text"  class="caixadetexto5" name="q" size="30" x-webkit-speech/>
<input type="submit" class="botprocura5" value=""/></form>

Espero que tenham gostado de todos. Se gostou, deixe um comentário e mostre para seus
amigos o/.

Marcadores: , , ,