[Tutorial]Mudar css de um elemento após ele obter e perder foco.

Estimados membros,

Neste tutorial irei ensina-los como mudar a css de um elemento após ele receber e perder foco.
Primeiro adicione um atributo onfocus com o valor this.className=''; Insira entre as aspas simples como queres que fique a class do elemento.

Código:

onfocus="this.className='teste';"

Agora adicione outro atributo, com o nome de onblur com o valor this.className=''; Insira entre as aspas o nome que ficará após o elemento perder o foco.

Código:

onblur="this.className='teste1';"

Caso já tenha uma class quando o elemento não tem foco, ponha o valor dela.

Código:

onblur="this.className='class_do_elemento';

Exemplo:

Código:

<input type="text" class="testet" onfocus="this.className='teste';" onblur="this.className='testet';" />

Agora crie um css:
Caso ele tenha uma class própria, como no exemplo acima.

Código:

.class_do_elemento{
funcoes-css
}
.class_do_elemento_com_focus{
funcoes-css
}

Exemplo:

Código:

.testet{
funcoes-css
}
.teste{
funcoes-css
}

Caso ele não tenha uma class própria:

Código:

.class_quando_elemento_recebe_foco{
funcoes-css
}
.class_do_elemento_quando_perde_foco{
funcoes-css
}

Créditos totais á mim.