Efeito descrição dos grupos em hover

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Efeito descrição dos grupos em hover

Mensagem por Junim_xD em 09/10/14, 09:56 am

  • 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

avatar

Junim_xD
Nível 6

Masculino
Inscrito dia : 28/06/2014
Mensagens : 71
Pontos Ativos : 127

Ver perfil do usuário http://brasilrpgcity.forumeiros.com/

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Hancki em 09/10/14, 10:32 am

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
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8047
Pontos Ativos : 12032

Ver perfil do usuário http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://www.facebook.com/djtomoficial

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Junim_xD em 11/10/14, 10:49 am

Não funciono oque faço?
avatar

Junim_xD
Nível 6

Masculino
Inscrito dia : 28/06/2014
Mensagens : 71
Pontos Ativos : 127

Ver perfil do usuário http://brasilrpgcity.forumeiros.com/

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por iPrompt em 11/10/14, 11:09 am

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é
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Junim_xD em 11/10/14, 11:13 am

Não funcionou :/ mesma coisa
avatar

Junim_xD
Nível 6

Masculino
Inscrito dia : 28/06/2014
Mensagens : 71
Pontos Ativos : 127

Ver perfil do usuário http://brasilrpgcity.forumeiros.com/

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Faker em 13/10/14, 11:58 am

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
avatar

Faker
Nível 6

Masculino
Inscrito dia : 03/10/2014
Mensagens : 61
Pontos Ativos : 76

Ver perfil do usuário

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por David Costa em 13/10/14, 02:26 pm

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";
avatar

David Costa
Nível 1

Masculino
Inscrito dia : 22/04/2014
Mensagens : 2
Pontos Ativos : 2

Ver perfil do usuário http://brasilluckystrike.forumeiros.com

Resolvido Re: Efeito descrição dos grupos em hover

Mensagem por Sennior em 18/10/14, 12:39 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum