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
» Bug no plug-in "Criar tags bbcode" do Daemon
Hoje à(s) 23:05 por luuuiiiz

» PHP em widget
Hoje à(s) 22:33 por MateusAnjosV

» Personalizar categorias do fórum
Hoje à(s) 22:30 por Cream

» Anti flood no chatbox
Hoje à(s) 21:22 por Cream

» Botões CKeditor funcional
Hoje à(s) 21:14 por while

» Aumentar limite dos campos RPG
Hoje à(s) 21:00 por Cream

» Aumentar o avatar do fórum
Hoje à(s) 20:41 por Cream

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
Cream
 
Shek
 
while
 
Holkis
 
Mr.Probz
 
lavinnia
 
Sennior
 
Harold C+
 
BichodoMato
 
JrMAFiA
 

Quem está conectado
107 usuários online :: 7 usuários cadastrados, Nenhum Invisível e 100 Visitantes :: 3 Motores de busca

[SRD]JimClark, Connor R., Cream, JrMAFiA, Sckool, Shek, while

[ Ver toda a lista ]


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

Melhoria do ''exibir perfil''

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

Resolvido Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 13:12

Detalhes da dúvida


Versão do fórum : PunBB
Nível de acesso : Fundador
Navegador usado : Google Chrome
Membros afetados : Todos os membros do fórum
Endereço do fórum : http://bomba-games.com/

Descrição do problema

Olá,
Eu estava procurando por soluções para otimizar o perfil do meu fórum (que está enorme) e achei esse tutorial: http://spdesign.ativoforum.com/t4473-tutorial-exibir-perfil só que tem um problema, apesar de tudo ter funcionado o botão ficou super feio no fórum, eu gostaria que alguém me auxíliasse com esses códigos para colocar um botão melhor, e se possível, o perfil já ser exibido apenas por passar o mause por cima.


Última edição por BombaGames em Sab 4 Abr 2015 - 15:21, editado 1 vez(es)

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/
  • 0

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 14:26

Olá @BombaGames!

Troque o JavaScript pelo seguinte:

Código:
jQuery(document).ready(function() {
   jQuery('.post .postmain .postbody .user').each(function() {
      jQuery(this).find('.user-info').insertAfter(this);
      jQuery(this).find('.user-ident').after('<input onclick="jQuery(this).closest(\'.postbody\').find(\'.user-info\').fadeToggle();" style="font-weight: bold;font-family: Arial;" value="Exibir perfil" class="iheloadB" type="button">');
   });
});

Agora adicione isso a seu CSS:

Código:
.iheloadB {
  -moz-transition: background-color .5s;
  -o-transition: background-color .5s;
  -webkit-transition: background-color .5s;
  background-color: #1AB8D6;
  border-color: rgba(0,0,0,0.16);
  border-radius: 6px;
  border-style: solid;
  border-width: 1px 1px 3px;
  box-shadow: inset 0 0 2px rgba(255,255,255,0.76);
  color: #FFF;
  display: block;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 6px;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
  transition: background-color .5s;
  outline: none;
}
.iheloadB:hover {
  background-color: #22D5E7;
  cursor: pointer;
  outline: none;
}
.iheloadB:active {
  border-width: 1px;
  padding: 12px 6px 10px;
  outline: none;
}

Até mais.

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 14:40

Perfeito, só ouve um único infeliz incidente, o botão antigo ainda continuou mesmo com o código alterado. :/ Mas o novo apareceu, logo abaixo.

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 14:46

@BombaGames, o senhor alterou o código JavaScript ou adicionou o que eu passei, no caso contendo 2 códigos?

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 14:49

Espera um pouco, eu alterei o errado e agora bugou tudo, o que você passou tinha dado certo '-' e eu acabei apagando css q n era pra apagar

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 14:53

@BombaGames, apaga o CSS que eu te passei, e apaga o código que você tem do botão, e vamos de novo rsrs.

Coloque o seguinte JavaScript:

Código:
jQuery(document).ready(function() {
   jQuery('.post .postmain .postbody .user').each(function() {
      jQuery(this).find('.user-info').insertAfter(this);
      jQuery(this).find('.user-ident').after('<center><input onclick="jQuery(this).closest(\'.postbody\').find(\'.user-info\').fadeToggle();" style="font-weight: bold;font-family: Arial;" value="Exibir perfil" class="iheloadB" type="button"><br></center>');
   });
});

Agora adicione isso a seu CSS:

Código:
.iheloadB {
  -moz-transition: background-color .5s;
  -o-transition: background-color .5s;
  -webkit-transition: background-color .5s;
  background-color: #656666;
  border-color: rgba(0,0,0,0.16);
  border-radius: 6px;
  border-style: solid;
  border-width: 1px 1px 3px;
  box-shadow: inset 0 0 2px rgba(255,255,255,0.76);
  color: #FFF;
  display: block;
  font-size: 14px;
  font-weight: 700;
  padding: 7px 15px;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
  transition: background-color .5s;
  outline: none;
}
.iheloadB:hover {
  background-color: #888888;
  cursor: pointer;
  outline: none;
}
.iheloadB:active {
  border-width: 1px;
  padding: 8px 15px;
  outline: none;
}

Eu personalizei o botão, meio cinza escuro, para combinar com seu fórum! Se quiser azul como o antigo só falar.

Até mais.

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 14:58

Deu certo sim, mas tem apenas um problema. Os perfil já está aparecendo antes mesmo de clicar, só resolver isso que fica tudo ok. Veja nesse meu fórum de teste como ficou:
http://mundodaciencia.forumeiros.com/t36-didatica-artigos-didaticos-para-o-aprimoramento-pessoal

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 15:03

@BombaGames, este erro do perfil aparecer antes de clicar no botão, ocorria já antes de eu fazer as alterações, ou começou depois que eu editei o código?

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 15:04

Depois que editou

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 15:07

@BombaGames, troque por este seguinte código, e veja se resulta, pois estou confuso Louco .

Código:
jQuery(document).ready(function() {
  jQuery('.post .postmain .postbody .user').each(function() {
      jQuery(this).find('.user-info').insertAfter(this);
      jQuery(this).find('.user-ident').after('<center><input onclick="jQuery(this).closest(\'.postbody\').find(\'.user-info\').fadeToggle();" style="font-weight: bold;font-family: century gothic;" value="Exibir perfil" class="iheloadB" type="button"><br></center>');
  });
});

Até.

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 15:09

Esse mudou a posição do botão, estava do lado esquerdo, dai foi pro direito '-'

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 15:14

Acabei de fazer um teste, deve ser com o css, pq eu botei o css do outro fórum, mesclado com o seu e precisava clicar para aparecer (apesar do botão continuar do mesmo jeito)

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/
  • 0

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por iHeloaD em Sab 4 Abr 2015 - 15:17

@BombaGames, tire o CSS que eu te passei, e o CSS que estava no tutorial do SPDesign, e adicione o seguinte a seu fórum:

Código:
.iheloadB {
  -moz-transition: background-color .5s;
  -o-transition: background-color .5s;
  -webkit-transition: background-color .5s;
  background-color: #656666;
  border-color: rgba(0,0,0,0.16);
  border-radius: 6px;
  border-style: solid;
  border-width: 1px 1px 3px;
  box-shadow: inset 0 0 2px rgba(255,255,255,0.76);
  color: #FFF;
  display: block;
  font-size: 14px;
  font-weight: 700;
  padding: 7px 15px;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
  transition: background-color .5s;
  outline: none;
}
.iheloadB:hover {
  background-color: #888888;
  cursor: pointer;
  outline: none;
}
.iheloadB:active {
  border-width: 1px;
  padding: 8px 15px;
  outline: none;
}
.pun .post .user {
background: -moz-linear-gradient(top, #DDD 0%, #BFBFBF 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#DDD), color-stop(100%,#BFBFBF));
background: -webkit-linear-gradient(top, #DDD 0%,#BFBFBF 100%);
background: -o-linear-gradient(top, #DDD 0%,#BFBFBF 100%);
background: -ms-linear-gradient(top, #DDD 0%,#BFBFBF 100%);
background: linear-gradient(to bottom, #DDD 0%,#BFBFBF 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#bfbfbf',GradientType=0 );
}
.user-basic-info {
margin-top: 20px;
}
.user-info {
display: none;
position: absolute;
left: 430px;
z-index: 999;
background: rgba(255, 255, 255, 0.92);
border: 12px solid rgba(0,0,0,0.7);
padding: 12px;
font-family: century gothic;
font-size: 14px;
line-height: 1.8em;
}

Mantenha o JavaScript como esta.

Até mais.

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1688
Pontos Ativos : 4245

http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Melhoria do ''exibir perfil''

Mensagem por BombaGames em Sab 4 Abr 2015 - 15:21

Muito obrigado!! agora deu certinho! Feliz agora só falta eu resolver a bananada que eu fiz no meu fórum principal Louco

BombaGames
Nível 9

Masculino
Inscrito dia : 08/08/2011
Mensagens : 172
Pontos Ativos : 2199

http://bomba-games.com/

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