Descrição dos grupos

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

Resolvido Descrição dos grupos

Mensagem por iHeloaD em 08/05/14, 06:17 pm

  • Descrição:
Olá,

Como posso fazer este efeito em meu fórum? http://prntscr.com/3hg8ob.

Até mais.

  • Informações:
Fórum:http://cidadesocial.forumeiros.com/Versão:PUNBB
Tipo:Pedido de códigoTags:Descrição,grupos



Última edição por iHeloaD em 10/05/14, 06:11 pm, editado 1 vez(es)
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Descrição dos grupos

Mensagem por TheJokerGFR em 08/05/14, 06:37 pm

Olá,

Sobre as bordas, eu retirei a class .inner veja se é isso que o senhor queria...

E aqui o código com as informações que pediu
Código:
<style type="text/css">
.members-group .forumbg-table th{
    text-align:left;
}
.members-group .forumbg{
    padding:5px;
    border-radius:5px;
}
.members-group img{
    display: block;
    margin: 0 auto;
    max-width: 100%;
    max-height: 70px;
}
.members-group tr > td:nth-child(1){
    font-weight: bold;
}
</style>
<div class="members-group">
    <div class="forumbg forumbg-table">
        <table class="table1" colspacing="2">
            <thead><tr><th colspan="8">Grupos do fórum</th></tr></thead>
            <tbody>
            <tr class="row3"><td colspan="2">Administrador</td></tr>

            <tr class="row1">
                <td>Rank</td>
                <td><img src="http://s5.postimg.org/pxoz9yacj/001.gif"></td>
            </tr>

            <tr class="row1">
                <td>Função</td>
                <td>Administrar o fórum</td>
            </tr>
                
            <tr class="row3"><td colspan="2">Membros do grupo</td></tr>

            <tr class="row1">
                <td class="mp"><a href="/privmsg?mode=post&u=1"><img src="http://illiweb.com/fa/prosilver/icon_contact_pm.png" alt="Enviar uma mensagem privada" title="Enviar uma mensagem privada"></a></td>
                <td><a href="/u1"><span style="color:#BF3131"><strong>Admin</strong></span></a></td>
            </tr>

            </tbody>
        </table>
    </div>
</div>

Para o rank não ficar muito grande, adicionei a seguinte regra CSS ao código:
Código:
max-height: 70px;

Caso não queira que ele seja redimensionado, remove ela, ou então altere seu valor...

Resultado:
avatar

TheJokerGFR
Usuário avançado

Masculino
Inscrito dia : 22/09/2012
Mensagens : 316
Pontos Ativos : 473

Ver perfil do usuário

Resolvido Re: Descrição dos grupos

Mensagem por iHeloaD em 08/05/14, 08:07 pm

Olá,

Não viu a print que eu queria? Quando passamos o mouse no nome dos grupos, e nos usuários pertencentes aos grupos, aparecesse aquelas descrições.

Até mais.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Descrição dos grupos

Mensagem por Kyo Panda em 09/05/14, 10:31 pm

Olá,

Poderia seguir as recomendações desse tópico?
http://ajuda.forumeiros.com/t91529-efeito-tootip-membros-staff-fdf#621885

Abraços. Feliz
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

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

Resolvido Re: Descrição dos grupos

Mensagem por iHeloaD em 09/05/14, 10:45 pm

Olá,

Só aparece quando passamos o mouse aqui http://prntscr.com/3hss4b, na legenda e nos usuários conectados, o mesmo não resulta.

Até mais.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Descrição dos grupos

Mensagem por Kyo Panda em 09/05/14, 10:52 pm

Troque por esse:

Código:
.leyenda_css a[href^="/g"],
a[href^="/u"] span[style^="color"] strong {
  position: relative
}

.leyenda_css a[href^="/g"]:hover:before,
a[href^="/u"] span[style^="color"] strong:hover:before {
  bottom: 17px;
  left: 15px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: transparent;
  border-top-color: rgba(0, 0, 0, 0.5);
  border-width: 7px;
  margin-left: -7px;
}

.leyenda_css a[href^="/g"]:hover:after,
a[href^="/u"] span[style^="color"] strong:hover:after {
  background-color: rgba(0,0,0,0.5);
  border-radius: 3px;
  bottom: 30px;
  color: #fff;
  display: block;
  padding: 3px 10px;
  font-style: normal;
  font-weight: 700;
  left: -15px;
  text-align: center;
  position: absolute;
  white-space: nowrap;
  z-index: 1;
  font-size: 10px;
  line-height: 1.5em;
}

#onlinelist {
  overflow: visible;   
}

E para cada grupo:

Código:
.leyenda_css a[href^="/g2-"]:hover:after,
a[href^="/u"] span[style*="#AA00FF"] strong:hover:after {
  content: "Descrição do Administradores."
}

Feliz
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

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

Resolvido Re: Descrição dos grupos

Mensagem por iHeloaD em 09/05/14, 11:14 pm

Olá,

Bem, ocorreu este erro http://prntscr.com/3hsz5g, sei que e problemas com meus códigos, mas tem um código externo para corrigi-lo?

Obrigado.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Descrição dos grupos

Mensagem por Kyo Panda em 10/05/14, 09:06 am

Bem, o código que te passei soluciona esse problema:



Mais em específico essa parte:

Código:
#onlinelist {
  overflow: visible; 
}

Chegou a adicionar o código no fim do CSS? Feliz
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

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

Resolvido Re: Descrição dos grupos

Mensagem por iHeloaD em 10/05/14, 06:11 pm

Perfeito, muito obrigado!

Até mais.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

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