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

Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17248
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
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:

Quem está online

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