ao passar mouse nao esta pegando ate a hr , ultrapaça a hr

[mestre fyoda 1]

eu to dividindo os links dos menus com hr , e ao passar o mouse muda a cor de fundo , mas tem um probleminha , uma parte pequena abaixo do hr está mudando de cor , como que eu faço para mudar apenas acima da hr ?

<table id="texto" width="150px" align="center" > <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center><hr style="border-style: dashed; border-color: red;"></td> </tr> <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center><hr style="border-style: dashed; border-color: red;"></td> </tr> <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center><hr style="border-style: dashed; border-color: red;"></td> </tr> </table>

[pa_bruno 0]

codigo bem sujo... mas... fazer o q neh... experimenta colocar mais um <tr> e um <td> com o hr... sem o javascript... ae naum pega http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[mestre fyoda 1]

nao deu certo , entra aqui nesse link e veja o que deu .http://marula.servegame.com:8090/ e nao esqu~ça d epassa o mouse no cadastro

<div id="esquerda"> <table id="texto" width="150px"> <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center></td> </tr> <tr> <td><hr style="border-style: dashed; border-color: red;"></td> <tr> <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center></td> </tr> <tr> <td><hr style="border-style: dashed; border-color: red;"></td> <tr> <tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)"><center><a href="">Cadastro</a></center></td> </tr> <tr> <td><hr style="border-style: dashed; border-color: red;"></td> <tr> </table></div>

eu queria que peguace tudo entre o hr , mas nao esta pegando , pq ?

[pa_bruno 0]

aki tah tudo certo...

pq você naum faz isso dentro de um link? naum precisaria de nenhum javascript, nem nada... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[mestre fyoda 1]

eu quero pegar tudo que esta entre as hr e mudar a cor , mas nesse codigo so ta mudando aonde esta o link

[pa_bruno 0]

claro... soh tem o link no tr... ae você teria q zerar a margem do hr e colocar um padding na tr onde tem o link...

[mestre fyoda 1]

hehe você ja deve estar de saco cheio de mim :) mas você poderia passar como ficaria o codigo , nao manjo muito .

[pa_bruno 0]

.padTD { padding: 5px 0; }hr { margin: 0; }

e chama nos tds:

<td class="padTD">texto</td>

e

<td><hr /></td>

entendeu?

 

logicamente q você tem q manter o codigo javascript nas td onde tem os links beleza?

poderia ficar melhor, mas creio q você terá um grande trabalho para deixar tudo nos padrões.. ;)

[mestre fyoda 1]

mano nao deu certo , eu queria faze o seguinte ,entre os -------------------clicando aqui toda essa parte muda de cor-------------------

[pa_bruno 0]

cara... posta ae um link pra mostrar como você fez...

[mestre fyoda 1]

<style type="text/css"> <!-- .padTD { padding: 5px 0; } hr { margin: 0; } --> </style>

<tr> <td onMouseover="mudacor(this)" onMouseOut="voltacor(this)" class="padTD"><hr /><center><a href="">Cadastro</a></center></td> </tr> <tr> <td><hr /></td> </tr>

[pa_bruno 0]

tenta isso ae

a.link {display: block;position: relative;padding: 5px 0;}td, tr, hr { margin: 0; }

<tr><td><hr /></td></tr><tr><td align="center"><a href="#" class="link">Cadastro</a></td></tr><tr><td><hr /></td></tr>

[mestre fyoda 1]

mano faltou o onMouseover="mudacor(this)" onMouseOut="voltacor(this)" :) , adicionei e nao deu certo nao . ele so pega um pedaço . veja no proprio site http://marula.servegame.com:8090/

[pa_bruno 0]

naum precisa do javascript naum cara... eh soh você modificar a classe q o link recebe...

a.link -> recebe as funções do voltacor

a.link:hover -> recebe as funções do mudacor

 

entendeu? http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

muda também...

td, tr, hr { margin: 0; }

para

td, tr, hr, table { margin: 0; padding: 0; }

e adiciona:

table { border-collapse: collapse; }

pode ser q fike pouca coisa... ae se ficar, você coloca borda nos tds... pode ficar melhor... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[mestre fyoda 1]

tb nao deu certo .teria como você me passa um site que tenha menus proficionais ?

[pa_bruno 0]

faz uma busca aki no forum de webstandards q tem bastante coisa...

 

mas a primeira coisa, esqueça tabelas... senaum terás problemas... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif