Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais


Meriteiro

Agosto de 2016



"Este membro destacou-se pela sua dedicação e pelo seu esforço.
Ao longo do último mês, demonstrou as suas capacidades gerais no FDF e, por isso, merece o nosso agradecimento."
Login

Esqueci minha senha

Últimos assuntos
» Apareceu isso do nada no meu fórum. Como tira?
Hoje à(s) 3:03 por while

» Duvida sobre e-mail de Fundador
Hoje à(s) 2:58 por while

» Loja no fórum
Hoje à(s) 2:40 por while

» Codigo PHP roda em algum widget?
Hoje à(s) 1:55 por viniciussvl

» Perfil do usuário
Hoje à(s) 0:22 por Cepheus

» Sistema de pré-visualizar em HTML
Ontem à(s) 21:52 por Hancki

» Problema nas páginas devido aos anúncios
Ontem à(s) 18:18 por juleic1123

Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Últimas sugestões
Parceiros Forumeiros
Os membros mais ativos da semana
while
 
Cream
 
Shek
 
Holkis
 
PrisoN†BreaK
 
IsmaelS.
 
Ana Leandro
 
Sennior
 
YouTube3
 
Maori
 

Quem está conectado
92 usuários online :: 4 usuários cadastrados, 1 Invisível e 87 Visitantes :: 2 Motores de busca

Nean, Uatyla, while, YouTube3

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Informações do usuário em modo hover

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

Resolvido Informações do usuário em modo hover

Mensagem por YouTube3 em Qua 24 Fev 2016 - 22:31

Detalhes da questão


Endereço do fórum: http://white.forumeiros.com/
Versão do fórum: PunBB

Descrição


Olá, Queria saber se e Possivel botar um MouseFlat nesse Estilo em meu fórum

EXEMPLO: http://i.imgur.com/dYNljDI.png

Fórum onde vi: http://ipsfocus.net/4x/


Última edição por Zeek_Krieger em Qua 2 Mar 2016 - 1:24, editado 1 vez(es)

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com
  • 0

Resolvido Re: Informações do usuário em modo hover

Mensagem por Fraise em Qua 24 Fev 2016 - 23:10

Olá @Zeek_Krieger!

Aceda a Painel de Controle Seta Módulos Seta Gestão dos códigos JavaScript e crie um novo javascript investido 'Em todas as páginas' utilizando o seguinte código:
Código:
jQuery(document).ready(function() {
    $('.tcr a[href*="/u"]').mouseover(function() {
        $(this).parents('strong').css('position', 'left');
        $('.cp_geral').remove();
        $(this).parents('.tcr').css('overflow', 'visible');
        $(this).before('<a href="' + $(this).attr('href') + '"><div class="cp_geral" style="position:absolute;"><div class="cp_box"> <div class="cp_capa"> <div class="cp_capa-avatar"><img src="http://i.imgur.com/1rHWZUQ.gif" /></div> <div class="cp_capa-nick"> <strong>' + $(this).html() + '</strong> <span class="span_capa-nick"></span> </div> </div> <div class="cp_info"> <div class="cp_info-botoes"> <div class="cp_info-botoes-post"><strong></strong><span>posts</span></div> <div class="cp_info-botoes-rep"><strong></strong><span>reputação</span></div> <div class="cp_info-botoes-data"><strong></strong><span>cadastro</span></div> </div> </div> <div class="cp_icones"> <div class="cp_mp"><a href="/privmsg?mode=post&u=' + $(this).attr('href').replace('/u', '') + '">MP</a></div> <div class="cp_perfil"><a href="' + $(this).attr('href') + '">PERFIL</a></div> </div></div> </div></a>');
        $.get($(this).attr('href'), function(cps) {
            $('.span_capa-nick').html($('#profile-advanced-right .main-content.clearfix.center:eq(0)', cps).html());
            $('.cp_capa-avatar').html($('#profile-advanced-right .main-content.clearfix.center:eq(0)', cps).html());
            $('.cp_info-botoes-data strong').html($('#field_id-4 dd div', cps).html());
            $('.cp_info-botoes-post strong').html($('#field_id-6 dd div', cps).html());
            $('.cp_info-botoes-rep strong').html($('#field_id-14 dd div', cps).html());

        });

        $('.cp_geral').mouseleave(function() {
            $(this).remove();
        });



    });
});

Em seguida, aceda a Painel de Controle Seta Visualização Seta Cores Seta Folha de estilo CSS e cole lá o seguinte código:
Código:
.cp_geral { width:340px; padding-top:50px; transition:all 150ms linear; } .cp_box { width:340px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; -webkit-box-shadow:1px 1px 12px 0 rgba(50,50,50,0.27); -moz-box-shadow:1px 1px 12px 0 rgba(50,50,50,0.27); box-shadow:1px 1px 12px 0 rgba(50,50,50,0.27); left:-120px; top:-13px; background:#fff; z-index:999; position:absolute; transition:all 150ms linear; margin:50px; } .cp_capa { background:#263340 url(http://i.imgur.com/6AnKAdN.png) right no-repeat; height:105px; -webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border-top-left-radius:10px; border-top-right-radius:10px; padding:5px 5px 0; } .cp_capa:before { content:""; display:inline-block; vertical-align:middle; margin-left:74px; width:0; height:0; position:absolute; top:-15px; border-left:15px solid transparent; border-right:15px solid transparent; border-bottom:15px solid #263340; } .cp_capa-avatar { -moz-border-radius:100%; -webkit-border-radius:100%; border-radius:100%; border:1px solid #d8d8d8; height:75px; width:75px; text-align:center; float:left; font-size:0; padding:7px; } .cp_capa-avatar img { -moz-border-radius:100%; -webkit-border-radius:100%; border:0 solid #d8d8d8; border-radius:100%; height:75px; width:75px; }.cp_capa-avatar img:nth-of-type(2){display:none} .cp_capa-nick { width:215px; height:75px; float:left; padding:25px 0 0 15px; } .cp_capa-nick strong { color:#fff!important; font-size:25px; font-weight:400!important; display:block; } .cp_info { text-align:center; padding:10px; } .cp_info-botoes { height:60px; width:320px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; text-decoration:none; } .cp_info-botoes a { text-decoration:none; } .cp_info-botoes-post { background:#ecf0f1; width:85px; height:53px; -webkit-border-top-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-bottomleft:10px; border-top-left-radius:10px; border-bottom-left-radius:10px; text-transform:uppercase; border-bottom:7px solid #bec3c7; float:left; } .cp_info-botoes-rep { background:#6bbd21; width:110px; height:53px; text-transform:uppercase; border-bottom:7px solid #68a72f; float:left; } .cp_info-botoes-rep strong { padding-top:8px; color:#fff; display:block; font-size:20px; } .cp_info-botoes-rep span { color:#fff; font-size:12px; } .cp_info-botoes-data strong { padding-top:8px; color:#666; display:block; font-size:15px; } .cp_info-botoes-data { background:#ecf0f1; width:125px; height:53px; -webkit-border-top-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-radius-topright:10px; -moz-border-radius-bottomright:10px; border-top-right-radius:10px; border-bottom-right-radius:10px; text-transform:uppercase; border-bottom:7px solid #bec3c7; float:left; } .cp_info-botoes-post,.cp_info-botoes-rep,.cp_info-botoes-data { transition:all 150ms linear; } .cp_info-botoes-post:hover,.cp_info-botoes-rep:hover,.cp_info-botoes-data:hover { opacity:0.65; -moz-opacity:0.65; filter:alpha(opacity=65); } .cp_icones { background:#ecf0f1; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px; border-bottom-right-radius:10px; border-bottom-left-radius:10px; color:#bec3c7; height:20px; padding:5px; } .cp_icones a { font-size:12px; text-decoration:none; color:#666; } .cp_mp,.cp_perfil { float:left; padding-left:10px; transition:all 150ms linear; } .cp_mp:hover { float:left; padding-left:10px; color:#c1392b; } .cp_mp:before { content:"\f003"; font-family:FontAwesome; padding:0 4px; } .cp_perfil:before { content:"\f007"; font-family:FontAwesome; padding:0 4px; } .cp_perfil:hover { padding-left:10px; color:#6bbd21; } .cp_mais { width:100%; } .cp_capa-avatar br,.span_capa-nick img,.span_capa-nick br { display:none; } .cp_capa-nick span,.span_capa-nick { color:#fff!important; font-size:12px; line-height:22px; font-weight:400!important; float:none!important} .cp_info-botoes-post strong { padding-top:8px; color:#666; display:block; font-size:20px; } .cp_info-botoes-post span,.cp_info-botoes-data span { color:#868585; font-size:11px; }

Abraços.
Fraise

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'


Bem-vindo ao fórum de suporte Forumeiros!
> Tenha conhecimento do regulamento do setor de suporte.
> Conheça a staff e suas diretrizes.
> Antes de perguntar, use a busca.
> Confira a lista de tutoriais.
> MP apenas para assuntos importantes!


Fraise
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4953
Pontos Ativos : 7057

http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Qua 24 Fev 2016 - 23:39

Olá, @Fraise então ficou outro estilo queria saber se tem como ficar exatamente como está na imagem ?

como ficou: http://i.imgur.com/LqHPGmD.png

como eu quero: http://i.imgur.com/OCjPPfh.png

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Sex 26 Fev 2016 - 23:48


YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Dom 28 Fev 2016 - 23:29


YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por j.lcm66 em Seg 29 Fev 2016 - 1:41

Boa questão.

j.lcm66
Novo membro

Masculino
Inscrito dia : 29/02/2016
Mensagens : 1
Pontos Ativos : 210

http://www.clubedotempradf.com
  • 0

Resolvido Re: Informações do usuário em modo hover

Mensagem por Fraise em Ter 1 Mar 2016 - 0:00

@j.lcm66 escreveu:Boa questão.
Olá!

Seja bem-vindo ao nosso fórum de Suporte! Como acabou de se inscrever, veja aqui alguns links importantes a saber:

Por gentileza, aconselho que você leia o regulamento do FdF:
Seta http://ajuda.forumeiros.com/t82-regras-do-forum-dos-foruns-fdf

Acabou de infrigir a regra 1.7, por favor, tome mais atenção da próxima vez. Envergonhado Muito feliz



Autor, quanto à sua questão, isso é demasiado complexo para mim, vamos esperar para ver se alguém assume o seu tópico. Muito feliz
@RafaelS. @MateusAnjosV

Abraços.
Fraise


Bem-vindo ao fórum de suporte Forumeiros!
> Tenha conhecimento do regulamento do setor de suporte.
> Conheça a staff e suas diretrizes.
> Antes de perguntar, use a busca.
> Confira a lista de tutoriais.
> MP apenas para assuntos importantes!


Fraise
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4953
Pontos Ativos : 7057

http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Ter 1 Mar 2016 - 2:18

Olá! Amigo @Fraise sem problemas obrigado, pela sua ajuda

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Qua 2 Mar 2016 - 0:15

Pode fechar este tópico @Fraise !

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por Noiadofuk em Qua 2 Mar 2016 - 1:33

Topico está marcado como resolvido, se foi resolvido mesmo, pode me passar o codigo? estava interessado em saber, algo bem complexo pelo que eu vi, parecido com a usada da plataforma ipb

Noiadofuk
Nível 7

Masculino
Inscrito dia : 07/01/2016
Mensagens : 90
Pontos Ativos : 399

http://brasilplaylife-samp.forumeiros.com/

Resolvido Re: Informações do usuário em modo hover

Mensagem por YouTube3 em Qua 2 Mar 2016 - 2:22

Olá! @Noiadofuk eu desisti do MouseFlat Estilo IPS

Abraços.
Zeek

YouTube3
Usuário destaque

Masculino
Inscrito dia : 04/01/2015
Mensagens : 766
Pontos Ativos : 1722

http://Ajuda.Forumeiros.com

Resolvido Re: Informações do usuário em modo hover

Mensagem por Fraise em Qua 2 Mar 2016 - 21:54

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

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


Bem-vindo ao fórum de suporte Forumeiros!
> Tenha conhecimento do regulamento do setor de suporte.
> Conheça a staff e suas diretrizes.
> Antes de perguntar, use a busca.
> Confira a lista de tutoriais.
> MP apenas para assuntos importantes!


Fraise
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4953
Pontos Ativos : 7057

http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

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
Fórum dos Fóruns - Ajuda mútua para usuários forumeiros
on
Fórum grátis: interajuda aos usuários forumeiros. Criar e administrar um fórum. Descubra nossos guias, tutoriais e astúcias no suporte de Forumeiros.
Votações: 5