Efeito descrição dos grupos em hover

+2
Hancki
Junim_xD
6 participantes

Ir para baixo

Tópico resolvido Efeito descrição dos grupos em hover

Mensagem por Junim_xD 09.10.14 13:56

  • Descrição:
Olá, estou aqui para pedir ajuda de vocês, um código CSS que aparece a legenda dos grupos quando passamos o mouse por cima igual aqui no forumeiros.
Tem como ?
Ou o código é exclusivo daqui?

  • Informações:
Fórum:brasilrpgcity.forumeiros.comVersão:PHPBB3
Tipo:Pedido de códigoTags:Efeito,descrição,grupos,hover

Junim_xD
Junim_xD
**

Membro desde : 28/06/2014
Mensagens : 71
Pontos : 127

http://brasilrpgcity.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Hancki 09.10.14 14:32

Olá!

Não é exclusivo, mas tem que tomar atenção no processo!
O código é este:
a[href="/g21-admineiros"] {
   position: relative;
}

#main-content > p > em > b > a[class="gensmall"][href="/g21-admineiros"]:hover:after {
   background-color: rgba(255,66,0,0.5);
   border-radius: 5px;
   bottom: 15px;
   color: #fff;
   content: "Gestão administrativa e técnica do fórum";
   display: inline-block;
   font-size: 10px;
   font-style: normal;
   font-weight: 700;
   left: -75px;
   padding: 2px;
   position: absolute;
   white-space: nowrap;
   z-index: 1;
}
A parte a negrito, corresponde ao endereço do grupo! Ou seja, para corresponder ao link exato!
No seu caso seria: /g3-dono-geral

Hancki
Hancki
Hancki
Membro Entusiasta

Membro desde : 03/10/2009
Mensagens : 8195
Pontos : 12250

https://ajuda.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Junim_xD 11.10.14 14:49

Não funciono oque faço?
Junim_xD
Junim_xD
**

Membro desde : 28/06/2014
Mensagens : 71
Pontos : 127

http://brasilrpgcity.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Roevs 11.10.14 15:09

Olá,

Tente utilizar este código, siga os mesmo procedimentos do Hancki

Código:
#main-content > p > em > b > a[class="gensmall"][href="/g11-ajudeiros"]{
position:relative
}
#main-content > p > em > b > a[class="gensmall"][href="/g11-ajudeiros"]:hover:after{
background-color:rgba(130,93,0,0.5);
border-radius:5px;
bottom:15px;
color:#fff;
content:"Suporte no atendimento aos usuários";
display:inline-block;
font-size:10px;
font-style:normal;
font-weight:700;
left:-70px;
padding:2px;
position:absolute;
white-space:nowrap;
z-index:1
}

Até
Roevs
Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Junim_xD 11.10.14 15:13

Não funcionou :/ mesma coisa
Junim_xD
Junim_xD
**

Membro desde : 28/06/2014
Mensagens : 71
Pontos : 127

http://brasilrpgcity.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Faker 13.10.14 15:58

Oi,

Você modificou a parte: "/g21-admineiros" por "/g3-dono-geral", está no código que lhe mandaram, basta fazer a substituição e salvar.

Até mais. Feliz aniversário
Faker
Faker
**

Membro desde : 03/10/2014
Mensagens : 61
Pontos : 76

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por David Costa 13.10.14 18:26

Painel de Controle > Vizualização > Cores > Folha de Estilo CSS.

Código:
#main-content > p > em > b > a[class="gensmall"][href^="/g3"],
a[href^="/u"] span[style^="color"] strong {
  position: relative
}
#main-content > p > em > b > a[class="gensmall"][href^="/g3-"]:hover:after,
a[href^="/u"] span[style*="#00EB2F"] strong:hover:after {
    background-color: rgb(0, 0, 0, 0. 5);
    border-radius: 2px;
    bottom: 15px;
    color: #fff;
    content: "Seu texto aqui";
    display: inline-block;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    left: -60px;
    padding: 3px;
    position: absolute;
    white-space: nowrap;
    z-index: 1;
}
OBS: Troque esta cor para o que você quiser.
Código:
span[style*="#00EB2F"]


OBS2: Edite esta parte com o seu texto.
Código:
content: "Seu texto aqui";
David Costa
David Costa
Novo Membro

Membro desde : 22/04/2014
Mensagens : 2
Pontos : 2

http://brasilluckystrike.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Sennior 18.10.14 4:39

Efeito descrição dos grupos em hover Symbol10Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para Questões resolvidas.
Sennior
Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos