Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17639
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Mudar a cor da linha na tabela ao passar o cursor

31-03-2007 13:18

Vamos aprender aqui uma forma prática de trocar a cor de fundo de uma linha na tabela ao passar o cursor.

Para ficar mais fácil, usarei estilos CSS.

Nosso estilo vai ficar da seguinte forma:

<style type=text/css> .celula {background-color:white} .celulahover {background-color:gray} </style>

Note que temos duas class no css: celula (para linha normal) e celulahover (para linha ao passar o cursor).

Vejamos agora nossa tabela:

<table width="10%" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="celula" onMouseover="this.className='celulahover'" onMouseout="this.className='celula'">texto 1</td> </tr> <tr> <td class="celula" onMouseover="this.className='celulahover'" onMouseout="this.className='celula'">texto 2</td> </tr> </table>

Note que o td tem celula na class (estilo padrão) e no onMouseout (ao retirar o cursor do td)

E celulahover somente ao passar o cursor sobre o td.
1
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado