Efeito sobre o titulo do fórum

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

Resolvido Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 09/02/14, 12:04 am

Qual é minha questão:
Ola, Bom gostaria de adicionar esse efeito ao passar o cursor sobre o titulo do fórum:


Fórum em que vi isso:
http://artelib.forumeiros.com/forum

Agradeço dês de já

Endereço do meu fórum:
http://style-art.forumeiros.com/

Versão do fórum:
PunBB


Última edição por Nemo~ em 10/02/14, 11:43 pm, editado 3 vez(es)
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Hancki em 09/02/14, 02:17 pm

Olá!

Use este CSS:
Código:
DIV.maintitle.floated.clearfix {
  font-size: auto;
  -webkit-transition: font-size 1s ease-in;
  -moz-transition: font-size 1s ease-in;
  -o-transition: font-size 1s ease-in;
  -ms-transition: font-size 1s ease-in;
  transition: font-size 1s ease-in;
}
DIV.maintitle.floated.clearfix:hover {
  font-size: 20px;
}
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 sobre o titulo do fórum

Mensagem por Nosferatu~ em 09/02/14, 03:34 pm

Ola, O Código Não resultou
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Hancki em 09/02/14, 03:46 pm

Aqui deu, repare: http://i.imgur.com/bNBUTuR.gif
Poderia mandar um print, especificando onde quer que surja o efeito?

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 sobre o titulo do fórum

Mensagem por Nosferatu~ em 09/02/14, 10:11 pm

Ola, Veja que na imagem o titulo esta centralizado e o fundo preto e branco... , 
Porem o código que me mandou so aumenta o tamanho do texto , se possível quero o efeito em geral 
(Texto Centralizado em bold , colorir a categoria ao passar o cursor e aumento do titulo) :  
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu
  • 0

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Boster Cheats em 09/02/14, 10:18 pm

Olá Adicione ao seu CSS:

Código:
.page-title h2:hover {
background: #181818 url(http://s5.postimg.org/wj1z6xt5z/free_floral_vector.png) repeat-x center center!important;
letter-spacing: 1px;
transition: .3s;
}

.page-title h2 {
background: #181818 url(http://s5.postimg.org/taxhtw6w7/image.png) repeat-x center center!important;
border: 1px solid #333;
border-bottom-right-radius: 0!important;
border-radius: 8px!important;
border-top-left-radius: 0!important;
box-shadow: 0 2px 3px #111 inset;
color: #eee;
cursor: pointer!important;
display: block;
font-family: Helvetica, Open Sans, Tahoma!important;
font-size: 14px!important;
font-weight: 700;
padding: 10px!important;
text-shadow: -1px 1px #000!important;
transition: .3s;
}


Valide! Se Ajudei Agradeça.

Boster Cheats
Nível 4

Masculino
Inscrito dia : 09/01/2014
Mensagens : 29
Pontos Ativos : 39

Ver perfil do usuário http://bostercheats.uniogame.com/

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 09/02/14, 11:02 pm

Funcionou porem gostaria do titulo centralizado como na imagem...
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Gaaratsu em 09/02/14, 11:08 pm

Saudações!

Substitua o código fornecido por este:
Código:
.page-title h2:hover {
background: #181818 url(http://s5.postimg.org/wj1z6xt5z/free_floral_vector.png) !important;
background-repeat: repeat-x !important;
text-align: center !important;
letter-spacing: 1px;
transition: .3s;
}

.page-title h2 {
background: #181818 url(http://s5.postimg.org/taxhtw6w7/image.png) !important;
background-repeat: repeat-x !important;
text-align: center !important;
border: 1px solid #333;
border-bottom-right-radius: 0!important;
border-radius: 8px!important;
border-top-left-radius: 0!important;
box-shadow: 0 2px 3px #111 inset;
color: #eee;
cursor: pointer!important;
display: block;
font-family: Helvetica, Open Sans, Tahoma!important;
font-size: 14px!important;
font-weight: 700;
padding: 10px!important;
text-shadow: -1px 1px #000!important;
transition: .3s;
}
Salve! Positivo

Cordiais saudações! Muito feliz


HAKUOUKI

               
   
Respeite as Regras Gerais do Fórum e conheça a nossa Equipe;
   Veja a Lista de FAQs do CPainel e Lista de Tutoriais;
   Ferramentas do(a) Administrador(a);
   Assinalar um Litígio.

   
   


   "Seria o único propósito da folha, o de cair?".

   
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 5927
Pontos Ativos : 7405

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

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 10/02/14, 12:03 am

Ola, Funcionou ! Mas ficou um fundo azul atrás ... 
Poderia me ajudar a remover ? 
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Alex Habilidade em 10/02/14, 06:47 pm

Olá,

Para centralizar o titulo adicione em sua folha CSS:
Código:

.maintitle.floated.clearfix {
    text-align: center!important;
}

Alex
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 10/02/14, 06:48 pm

Nemo~ escreveu:Ola, Funcionou ! Mas ficou um fundo azul atrás ... 
Poderia me ajudar a remover ? 
Ja resolvi a parte do texto mais ainda esta com fundo azul queria remove-lo 
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por JScript em 10/02/14, 09:06 pm

Nemo~ escreveu:Ola, Funcionou ! Mas ficou um fundo azul atrás ...
Poderia me ajudar a remover ?

Ja resolvi a parte do texto mais ainda esta com fundo azul queria remove-lo
Olá!
Observe a imagem abaixo:


Ela foi retirada diretamente do fórum que você informou no ato da criação do tópico (http://styleart.forumeiros.com), perceba que não há título centralizado, assim como não há o fundo azul atrás dele!


Vou tentar lhe explicar a razão de tanta postagem ainda não ter dado certo pra você:
1- Este endereço: http://styleart.forumeiros.com - não condiz com as imagens contendo os códigos adicionados por você, logo fica explícito que este não é o seu fórum e sim um mero fórum de testes!
2- Agora se a versão do seu fórum for diferente do fórum que postou aqui, fica mais difícil pra nós lhe ajudarmos...
3- É essencial e imprescindível que as informações citadas ao criar o tópico reflitam o real na qual você deseja ter sua questão resolvida, com isso evita-se várias postagens desnecessárias e o resultado obtido seria mais rápido.


JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

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

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 10/02/14, 11:18 pm

Aqui esta o endereço original , 
http://style-art.forumeiros.com/
Não havia percebido o endereço de testes pois apenas um " " o separa do original
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu
  • 0

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por JScript em 10/02/14, 11:28 pm

@Nemo~
Ok, aqui está o código CSS para remover o "azul":

Código:

.main .main-head {
  padding: 0 !important;
}

Resultado:


Nota: Viu como é imprescindível sabermos onde é que vais aplicar os códigos?

Abraços,

JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

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

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por Nosferatu~ em 10/02/14, 11:43 pm

Obrigado ! 


Funcionou pode fechar! 
Até Mais Positivo
avatar

Nosferatu~
Usuário avançado

Masculino
Inscrito dia : 02/09/2011
Mensagens : 366
Pontos Ativos : 550

Ver perfil do usuário http://styleart.forumeiros.com/ https://www.facebook.com/AlanNemu

Resolvido Re: Efeito sobre o titulo do fórum

Mensagem por orlanxd em 11/02/14, 02:17 am

ISSO FUNCIONA NA VERSÃO PHPBB3? GOSTEI DESTE EFEITO TAMBÉM  zen 
avatar

orlanxd
Nível 5

Masculino
Inscrito dia : 03/04/2012
Mensagens : 46
Pontos Ativos : 78

Ver perfil do usuário http://plantap-cheats.forumais.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