Texto sumir do Input ao digitar e volta ao apagar

Enviada por Leandro 
Leandro
Texto sumir do Input ao digitar e volta ao apagar
09 de March de 2012 às 07:37PM
eu vi um efeito muito interessante no site do DeviantArt, o formulário deles tem um texto sobre os campos que some quando vc digita, e volta se vc apagar o texto que estava dentro. analisando esses dias o código fonte eu percebi que o texto dentro dos INPUTS era a tag <label> que foi posicionada ali dentro com CSS. mas ate o momento a unica coisa que cheguei perto de fazer é o texto sumir ao clicar, como todos fazem...entçao gostaria de um apelo a todos e tentar me ajudar a descobrir como eles fizeram isso. deuma coisa tenho certeza. foi javascript. mas como?


formulario da deviantart: https://www.deviantart.com/join/?utm_source=DA&utm_medium=UB&utm_content=JoinNow&utm_campaign=DA_UB_JoinNow_091409
Israel Block
Re: Texto sumir do Input ao digitar e volta ao apagar
12 de March de 2012 às 07:48AM
tem um plugin do jQuery que faz isso.
da uma olhada nesse link e ve se te ajuda
http://code.alexweber.com.br/jquery/coolinput/
abraço!
Marcos Regis
Re: Texto sumir do Input ao digitar e volta ao apagar
12 de March de 2012 às 02:27PM
EM HTML use o atributo placeholder.
Marcos Regis
Re: Texto sumir do Input ao digitar e volta ao apagar
12 de March de 2012 às 02:28PM
Corrigindo, em HTML5
Israel Block
Re: Texto sumir do Input ao digitar e volta ao apagar
12 de March de 2012 às 02:42PM
Legal Marcos, não sabia desse atributo. Tenho que explorar um pouco mais os recursos do HTML5.
Diego R. Mengarda
Re: Texto sumir do Input ao digitar e volta ao apagar
12 de March de 2012 às 02:42PM
Eu uso assim para um efeito simples de troca de texto

<input type="text" name="assunto" value="Assunto*" onfocus="if (this.value=='Assunto*') this.value='';" onblur="if (this.value=='') this.value='Assunto*'" />

se você quer com efeitos de fade ou slide, terá que fazer com jquery ou html5.
luciano marques
Re: Texto sumir do Input ao digitar e volta ao apagar
22 de January de 2018 às 02:02PM
tsrtrtr
Você precisa estar logado no PHPBrasil.com para poder enviar mensagens para os nossos fóruns.

Faça o login aqui.