Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

joazweb

Acessando atributo de classe CSS

Recommended Posts

Ola pessoal, procurei no forum algo que pudesse me ajudar, mas nada tratou especificadamente do q eu preciso

 

eh o seguinte eu tenho la duas classes exemplo:

 

.classe01 {

width:200px;

height:30px;

background-color:#333333;

}

.classe02 {

width:20px;

height:15px;

background-color:#666666;

}

 

o que eu quero fazer o seguinte, essas classes serao utilizadas para cada item do menu, ou seja terao varios delas na pagina, eu quero que ao passar o mouse sobre a classe01, mude o background dela para #FF0000 por exemplo, e TAMBEM mude o bg da classe02 para outra cor tipo #CCCCCC...

 

oq eu consegui fazer aqui eh com javascript(onmouseover=java script:mudabg()) pegar o ID da class02 e trocar o BG, soh que nao consegui fazer voltar o background na cor original.. e se eu for fazer assim, vou ter que criar um id diferente pra cada item do menu, pq senao ao passar o mouse sobre um vai trocar a cor de todos com o mesmo id, e eu nao posso pq eu to pegando os menus dinamicamente do banco de dados e nao sei quantos poderam vir a ter..

 

bom, espero que tenham entendido oq eu preciso e possam me dar ideias! algo que funcione nos navegadores..

Compartilhar este post


Link para o post
Compartilhar em outros sites

utilize o ONMOUSEOUT para voltar pra classe inicial ;)

 

ONMOUSEOVER -> efeito enquanto o mouse estiver sobre

ONMOUSEOUT -> efeito ao tirar o mouse

 

 

PS. num sei explicar mto bem :P, mas é isso ae :P

Compartilhar este post


Link para o post
Compartilhar em outros sites

bom, eu não sei se dar pra fazer com classe, mais se fosse eu faria assim oh..

 

 

#menu1 {

 

width:200px;

height:30px;

background-color:#333333;

 

}

 

#menu1:hover {

 

width:200px;

height:30px;

background-color:#FF0000 ;

 

}

 

#menu2 {

width:20px;

height:15px;

background-color:#666666;

}

 

#menu2:hover {

width:20px;

height:15px;

background-color:#CCCCCC;

}

 

 

assim você aplicaria uma id para cada menu, invés de classe, deu pra entender ??

 

espero ter ajudado abraços

Compartilhar este post


Link para o post
Compartilhar em outros sites

bom, eu não sei se dar pra fazer com classe, mais se fosse eu faria assim oh..

 

 

#menu1 {

 

width:200px;

height:30px;

background-color:#333333;

 

}

 

#menu1:hover {

 

width:200px;

height:30px;

background-color:#FF0000 ;

 

}

 

#menu2 {

width:20px;

height:15px;

background-color:#666666;

}

 

#menu2:hover {

width:20px;

height:15px;

background-color:#CCCCCC;

}

 

 

assim você aplicaria uma id para cada menu, invés de classe, deu pra entender ??

 

espero ter ajudado abraços

opaa. valeu ai pela ajuda.. mas você nao entendeu oq eu quiz dizer eu nao vou estar passando o MOUSE EM CIMA DO MENU2, eu vou passar em cima do MENU1 e automaticamente quero que mude o BG do MENU2 entende?? e eu tenho que usar classe, pq eu NAO SEI quantos items de menu eu vou ter, pq eu vou ta pegando dinamicamente do banco de dados.. a mesma coisa serve pro colega ali de cima, sei que se eu criar duas funcoes uma pra quando passar o o mouse e outra pra quando tirar funciona mas nao eh isso q eu quero pq vou ter que criar VARIOS funcoes desse jeito pegando o ID de cada ITEM do menu..

 

... bom nao sei se alguem vai poder me ajudar.. mesmo assim aceito novas sugestoes!

Compartilhar este post


Link para o post
Compartilhar em outros sites

se eu não me engano o ie6 só reconhece hover em A

 

------------- com o onmouse:

 

<style type="text/css">

.classe1 { background-color: #000000; }

.classe2 { background-color: #FF0000; }

</style>

 

<div class="classe1" onmouseover="this.className='classe2';" onmouseout="this.className='classe1';">Testando</div>

Compartilhar este post


Link para o post
Compartilhar em outros sites

se eu não me engano o ie6 só reconhece hover em A

 

------------- com o onmouse:

 

<style type="text/css">

.classe1 { background-color: #000000; }

.classe2 { background-color: #FF0000; }

</style>

 

<div class="classe1" onmouseover="this.className='classe2';" onmouseout="this.className='classe1';">Testando</div>

Desculpe, mas nao eh bem isso, eu estou passando o mouse em cima da classe1 certo? esse codigo muda o bg dela certo?

No meu caso eu tenho uma classe que ao passar o mouse em cima dela eu quero que mude o BG dela, e TAMBEM mude o BG de outra classe que eu quizer.. mas eu nao estou passando o mouse em cima dessa outra classe.. entende??

Compartilhar este post


Link para o post
Compartilhar em outros sites

Todas as idéias e dicas passadas anteriormentes são validas, até mesmo com javascript, lembro que tinha uma materia do maujor que especificava a alteração de cada item de um menu quando outro estava sobre o evento... deixa eu dar uma procurada...

Acho que é este:

http://www.maujor.com/tutorial/photolist.php#

Compartilhar este post


Link para o post
Compartilhar em outros sites

otimo! talvez eu tenha me espressado mau, valeu a galera que ajudou..

 

eh mais ou menos oq tem nesse link ai q eu preciso!! ja tinha visto ele tempo antras, mas nem me recordava... ehehehhe

 

muito obrigado.. vou testar aqui e ver oq posso fazer!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.