Efeito no banner do meu fórum

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

Resolvido Efeito no banner do meu fórum

Mensagem por Marcelo Rios em 04/03/13, 01:58 am

Qual é minha questão:
Olá Amigos, será que consigo colocar um efeito maneiro no banner do meu fórum, estou achando ele um pouco sem graça. Abaços.

Endereço do meu fórum:
http://jiu-jitsu.forumeiros.com

Versão do fórum:
PHPBB3


Última edição por Marcelo Rios em 06/03/13, 01:12 pm, editado 1 vez(es)
avatar

Marcelo Rios
Nível 9

Inscrito dia : 10/01/2012
Mensagens : 154
Pontos Ativos : 252

Ver perfil do usuário

Resolvido Re: Efeito no banner do meu fórum

Mensagem por .Danni. em 04/03/13, 08:17 am

Olá

Quando se refere à efeito, você diz CSS ou alterando o banner em um editor de imagens?

Cordialmente,
The Boss
avatar

.Danni.
Membro do Fórum

Feminino
Inscrito dia : 13/01/2010
Mensagens : 1860
Pontos Ativos : 2592

Ver perfil do usuário http://castelobruxo.tk https://www.facebook.com/dannielagoes

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Marcelo Rios em 04/03/13, 03:55 pm

M e refiro a CSS. Grato.
avatar

Marcelo Rios
Nível 9

Inscrito dia : 10/01/2012
Mensagens : 154
Pontos Ativos : 252

Ver perfil do usuário

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Marcelo Rios em 04/03/13, 08:10 pm

Será que consigo?
avatar

Marcelo Rios
Nível 9

Inscrito dia : 10/01/2012
Mensagens : 154
Pontos Ativos : 252

Ver perfil do usuário

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Gaaratsu em 05/03/13, 01:23 am

Olá querido,

Queira checar:
Caso não fique satisfeito e/ou não goste dos resultados, que tal fazer um movimento que ao passar o mouse ele vai para o lado? Se sim, aqui o código:

Código:
#logo {
    left: 100px;
    top: 5px;
    float: left;
    position: relative;
    background: url(LINK DA IMAGEM);
    width: 930px;
    text-indent: -9999px;
    height: 130px;
    display: block;
    margin: 0 auto;
    margin-bottom: 25px;
      -webkit-transition-duration: 1s;
      -moz-transition-duration: 1s;
      -o-transition-duration: 1s;
      transition-duration: 1s;
 
      -webkit-transition-property: -webkit-transform;
      -moz-transition-property: -moz-transform;
      -o-transition-property: -o-transform;
      transition-property: transform;
 
      overflow:hidden;
    }


    #logo:hover {
    background: url(LINK DA IMAGEM) 0px 0px;
      -webkit-transform:translate(80px);
      -moz-transform: translate(80px);
      -o-transform:translate(80px);
    }

    #logo:active {
    background: url(LINK DA IMAGEM) 0px 0px;
      -webkit-transform:scale(0.9);
      -moz-transform:scale(0.9);
      -o-transform:scale(0.9);
    }

Este código deve ser adicionado em:
Flecha ajudeiros Painel de Controle :seta2: Visualização :seta2: Imagens e Cores :seta2: Cores :seta2: Aba 'Folha de Estilo CSS'
Observação: Substitua os "LINK DA IMAGEM" pelo link do seu banner/logo.
Observação²: O senhor poderá colocar o banner original no primeiro, um banner mais claro ou escuro e/ou personalizado ao seu gosto no segundo e no terceiro colocar o banner original e/ou outro. As criatividades são diversas, basta fazer ao teu gosto! Muito feliz

Até mais. Piscada
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

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

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Marcelo Rios em 06/03/13, 03:18 am

Colei o código e o banner sumiu,rsrsrs. Tive que desfazer.
avatar

Marcelo Rios
Nível 9

Inscrito dia : 10/01/2012
Mensagens : 154
Pontos Ativos : 252

Ver perfil do usuário

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Jpjupa em 06/03/13, 10:04 am

Primeiramente, acesse a folha de estilo css.

Vou passar um efeito agradável porém bem simples na linguagem CSS3 e CSS, em todos meus projetos costumo utilizar e faz um bom sucesso.

Código:

#logo {
opacity: 1.0;
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
}

#logo:hover {
opacity: 0.2;
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
}

Caso, queira modificar o tempo da transição da opacidade, modifique os valores: 1s - 1 segundo.

Att, Jpjupa!
avatar

Jpjupa
Membro do Fórum

Masculino
Inscrito dia : 15/11/2010
Mensagens : 1369
Pontos Ativos : 1977

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

Resolvido Re: Efeito no banner do meu fórum

Mensagem por Marcelo Rios em 06/03/13, 01:12 pm

Hummm... gostei, rsrsrs. Obrigado cara e obrigado a todos que tentaram me ajudar.
avatar

Marcelo Rios
Nível 9

Inscrito dia : 10/01/2012
Mensagens : 154
Pontos Ativos : 252

Ver perfil do usuário

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