Ir para conteúdo

POWERED BY:

Arquivado

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

Marcos Coelho2

[Resolvido] Ao passar mouse em div mudar todos :hover dentro da d

Recommended Posts

Meu problema é o seguinte, quando se passar o mouse em cima da div eu quero que a div fique com o a:hover de todas as letras dos links em branco, mas so um está ficando em branco o outro link so fica branco quando passo o mouse em cima dele.

Vou passar o link e os códigos para vocês entenderem melhor.

Link do site: http://pacoesportes.com/

Se o link de cima redirecionar para a pagina mobile do site entre nesse link: http://pacoesportes.com/index.php/?___store=defaut

 

O style que eu estou usando é esse

 

.stylebemvindo {
font: 12px "Arial",Georgia,Times,sans-serif;
font-weight: bold;
color: orange;
text-align:center;
margin-top:0px;

}

 

Ele esta sem :hover mesmo porque ele esta buscando o :hover do outro style do menu que também vou passar.

 

Link do css do menu: http://pacoesportes.com/skin/frontend/galaeva/default/css/style.css

 

Acho que deve ser alguma interferencia de outras partes do css mas realmente não consegui fazer funcionar.

Já tentei colocar um :hover no "stylebemvindo" mas ele está lendo de qualquer forma o style do menu (link que passei)

 

A parte do style do link que passei que altera os valores do :hover é essa

 

ul#css3menu1 li:hover>a{

 background:url(http://pacoesportes.com/skin/frontend/galaeva/default/images/conta_anim.png) right center no-repeat;
 border-color:#0A409C;border-style:solid;color:#FFFFFF;
 }

 

Mas eu ja alterei e a unica coisa que acontece é que meus dois links só ficam com a cor branca quando se passa em cima de cada link e quando a div fica selecionada nenhum dos dois links pegam o :hover corretamente.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Em ambos os links, caí no site mobile. Mas, vamos tentar:

 

A classe .stylebemvindo pertence ao LI ou ao link A?

 

Se for ao LI:

 

ul#css3menu1 li.stylebemvindo:hover > a { ... }

 

Ou simplesmente declare "!important" no final do atributo que deseja.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pertence ao li

 

Como posso passar para a div ler por completo ao invez de cada link?

é pelo display?

 

o link agora ta funcionando da uma olhada la

http://pacoesportes.com/

 

no topo onde está sua conta quando se passa o mouse sobre a div deveria ficar tudo branco mas o link "minha conta"só fica quando passa o mouse em cima.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funcionou enquanto a div está selecionada.

mas quando passo o mouse pro menu o link volta a ficar preto.

da uma olhada no link la pra você entender melhor

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funcionou enquanto a div está selecionada.

mas quando passo o mouse pro menu o link volta a ficar preto.

da uma olhada no link la pra você entender melhor

 

É só passar o :hover pra LI que é PAI da UL que estava oculta:

 

.toproot:hover .stylesuaconta {
 color: #FFF;
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Muito Obrigado funcionou do jeito que eu queria

Mas aproveitando o topico...

 

Não sei se voce viu no meu site mas meu carrinho também esta com o mesmo problema quando passa o mouse por cima da div abre corretamente mas quando levo o mouse para o a aba que abre do carrinho a div perde o foco

Vou postar o css e te falar o que eu estou tentando para fazer da mesma forma que você me ajudou acima.

Primeiro vou postar o css

 

.topbusca .bgbusca .carrinho{
 float:right;
 width:100px;
 margin-top:-1px;
 height:47px;



}

.topbusca .bgbusca .carrinho  .sidebar-cart{ clear:left; }
.topbusca .bgbusca .carrinho  .sidebar-cart{ 

 height: 47px;

 width: 120px;
  display: inline-block;

}

.topbusca .bgbusca .carrinho  .sidebar-cart a {
width:120px;
 background:url(http://pacoesportes.com/skin/frontend/galaeva/default/images/carrinho_animacao2.png) right center no-repeat;
 height:47px;
 color: #FF6600;
 display: inline-block;
 font-size: 14px;
 font-weight: bold;
 line-height:40px;
text-align:left;
text-indent: 36px;
 text-decoration: none;
}
.topbusca .bgbusca .carrinho .sidebar-cart :hover{
	color: #fff;
 background:url(http://pacoesportes.com/skin/frontend/galaeva/default/images/carrinho_animacao.png) right center no-repeat;

 }

 

e agora vou postar o codigo da aba que abre pra baixo quando se passa o mouse em cima.

 

.topbusca .bgbusca .carrinho  #block-cart {  width:252px; position:relative; right:170px; top:0px; z-index:1;  }
.topbusca .bgbusca .carrinho  #block-cart .block-content { background:url("../images/bg_cart_bt.png") right bottom no-repeat; width:252px;  text-align:left; padding:7px 26px 30px;}
.topbusca .bgbusca .carrinho  #block-cart .btn-edit{ display:none; }
.topbusca .bgbusca .carrinho  #block-cart li{ border-bottom:1px dotted #bcbabb;}
.topbusca .bgbusca .carrinho  #block-cart .mini-products-list .product-image{ background:none; width:75px; height:75px; }
.topbusca .bgbusca .carrinho  #block-cart li .price{ display:block; color:#555354; font-weight:bold; padding:5px 0; }
.topbusca .bgbusca .carrinho  #block-cart li .product-details strong{ display:block; font-weight:normal; padding:5px 0; }

 

O basico é esse link do css completo: http://pacoesportes.com/skin/frontend/galaeva/default/css/styles.css

 

Nos proximos posts postarei o que estou tentando fazer para voce me ajudar se possivel

 

Meu li tem a classe "<li class="item last odd">"

mas essa classe só aparece quando eu tenho itens no carrinho

 

Estou tentando dessa forma

.block-cart .block-content:hover .topbusca .bgbusca .carrinho {color:#fff; }

 

já que a essa é a div responsavel pela configuracao da aba do carrinho.

 

essa div esta nesse bloco que nao te passei

 

/* Block: Cart */
.block-cart { }

.block-cart .block-title {  }
.block-cart .block-title strong { }
.block-cart .block-content { }
.block-cart .block-content:hover .topbusca .bgbusca .carrinho {color:#fff; }
.block-cart .summary {  overflow:hidden; }
.block-cart .amount { margin:0; }
.block-cart .amount a { }
.block-cart .subtotal { margin:5px 0 0; padding:2px 0; }
.block-cart .subtotal .label { float:left;}
.block-cart .subtotal .price { font-weight:bold; float:right; color:#555354; }
.block-cart .actions button.button { float:right; }
.block-cart .actions button.button span { background-image:url(../images/process_to_checkout.gif); width:134px; height:30px;}
.block-cart .actions button.button span span { display:none;  }

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.