Background dos fóruns - efeito hover

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

Resolvido Background dos fóruns - efeito hover

Mensagem por Kvothe em 04/01/14, 11:21 am

Qual é minha questão:
Olá pessoal,

Gostaria de saber se há algum código que eu possa implementar um background nos fóruns do meu Fórum com efeito hover, de modo que ao passar o mouse sobre o fórum, o background deste mude...

Obrigado,
Kvothe

Endereço do meu fórum:
http://landofhaeron.forumeiros.com

Versão do fórum:
PHPBB2


Última edição por Kvothe em 08/01/14, 07:11 pm, editado 1 vez(es)
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 04/01/14, 01:12 pm

Olá!

Será isto: http://ajuda.forumeiros.com/t75060- ?

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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 04/01/14, 02:13 pm

Sim, mas eu gostaria só do código para o fórum, não necessitando de mostrar a quantidade de tópicos e mensagens. E ao invés de cor, o efeito hover será por imagem.

Poderia editar o código para mim?
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 04/01/14, 04:14 pm

Use este CSS:
td.row1[colspan="1"]:hover {
background-image: url('LINK IMAGEM') !important;
background-repeat: no-repeat !Important;
}
Mude apenas o que está a verde pelo link da imagem que deseja no hover.

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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 04/01/14, 05:06 pm

Terei que usar o CSS + o código do tutorial?
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 05/01/14, 12:03 pm

Olá de novo!

Não, apenas o meu CSS e fazer as devidas alterações, mais especificamente, o link da imagem.

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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 05/01/14, 01:21 pm

Pois então, funcionou sim! Mas apenas o efeito hover... Eu gostaria de colocar um background fixo nas categorias também...

Obrigado,
Kvothe
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 05/01/14, 01:56 pm

Mudanças... Consegui o efeito, mas veja no meu fórum como ficou.. Apenas na segunda coluna... Não seria possível em toda a linha?
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 05/01/14, 01:59 pm

Passe-me o código que usou para eu poder reformular o código e lhe passar o correto.
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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 05/01/14, 02:06 pm

Utilizei o seu código mesmo, com uma pequena mudança:

Código:
td.row1[colspan="1"] {
background-image: url('http://i.imgur.com/k5YgFP7.png') !important;
background-repeat: repeat !Important;
}

td.row1[colspan="1"]:hover {
background-image: url('http://i.imgur.com/YaDsqhL.png') !important;
background-repeat: repeat !Important;
}

Antes que me ajude nisso, gostaria de saber se é possível alterar a cor padrão do fundo das tabelas por um background. Por exemplo, existem 3 cores que eu defino no painel "Cores", sendo eles:

  • Cor 1 de Coluna da Tabela;
  • Cor 2 de Coluna da Tabela;
  • Cor 3 de Coluna da Tabela.


É que percebi que o background não aprece, por exemplo, no post, mas apenas nas categorias mesmo...

Obrigado desde já,
Kvothe
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 06/01/14, 01:57 pm

UP  Muito feliz 
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 06/01/14, 04:15 pm

Bom, consegui alguns progressos. Veja, consegui colocar o background em todo o fundo das tabelas (imagem 2), entretanto há um bug em um dos quadros: o background só aparece com com o mouse sobre ele (imagem 1)

Imagem 1:

Imagem 2:

Talvez seja meu código, pois consegui meio que mexendo nele, sem nem mesmo entender o que eu estava fazendo direito, rs... O código é o seguinte:
Código:
td.row1 {
background-image: url('http://i.imgur.com/lv4dmXb.jpg') !important;
background-repeat: repeat !Important;
}

td.row1[colspan="1"]:hover {
background-image: url('http://i.imgur.com/5PFaJal.jpg') !important;
background-repeat: repeat !Important;
}

td.row2 {
background-image: url('http://i.imgur.com/lv4dmXb.jpg') !important;
background-repeat: repeat !Important;
}

td.row3 {
background-image: url('http://i.imgur.com/lv4dmXb.jpg') !important;
background-repeat: repeat !Important;
}

td.row4 {
background-image: url('http://i.imgur.com/lv4dmXb.jpg') !important;
background-repeat: repeat !Important;
}
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 07/01/14, 11:30 am

UP
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 07/01/14, 03:49 pm

Olá de novo!

Já tentei vários códigos diferentes e não estou a conseguir :/
Lamento!

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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 07/01/14, 04:17 pm

Tudo bem.. Última pergunta: não existe um código que simplesmente substitua o padrão da cor do painel por um bg?
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 07/01/14, 04:21 pm

Explique melhor a questão, por favor.
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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 07/01/14, 05:01 pm

Por exemplo, supondo que eu tire todo esse código do meu css, todos os quadros passarão a ter a cor padrão que eu escolhi no meu painel de controle. Ou seja, ao invés de criar um código que altere as propriedades das tabelas, talvez fosse possível alterar a cor em si, substituindo-a por um background.... Não sei se fui claro. Se não, posso explicar com mais detalhes e imagens..
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 07/01/14, 06:21 pm

Boas,

Consegui reparar o problema. Acessei o topics_list_box e procurei por isso:
Código:
<td class="row3Right" onmouseover='this.className="row1"' onmouseout='this.className="row3Right"' align="center" valign="middle" nowrap="nowrap"><span class="postdetails">{topics_list_box.row.LAST_POST_TIME}<br />{topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span></td>
E então substitui pelo seguinte código:
Código:
<td class="row3" align="center" valign="middle"><span class="postdetails">{topics_list_box.row.LAST_POST_TIME}<br />{topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span></td>

Não sei se isso irá interferir em algum outro parâmetro, mas aparentemente está tudo correto.

Agora, se acessar meu fórum, irá ver que eu apenas coloquei o efeito hover no quadro dos fóruns (como pode ver na imagem 1), como posso colocá-lo na visualização dos tópicos (imagem 2)?

Imagem 1:


Imagem 2:


Muito obrigado desde já,
Kvothe
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

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

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Kvothe em 08/01/14, 05:50 pm

UP Muito feliz 
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

Ver perfil do usuário http://landofhaeron.forumeiros.com
  • 0

Resolvido Re: Background dos fóruns - efeito hover

Mensagem por Hancki em 08/01/14, 06:25 pm

Olá de novo!

Só existe este código, mas creio que não corresponda ao desejado:
table.three-col td.row1:hover, table.three-col td.row2:hover, table.three-col td.row1:hover, table.three-col td.row3:hover {
background-image: url('LINK IMAGEM') !important;
background-repeat: no-repeat !important;
}
Não sei como resolver de outra maneira.

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: Background dos fóruns - efeito hover

Mensagem por Kvothe em 08/01/14, 07:10 pm

Bem,

Esse cria o efeito em tudo, mas tudo bem.. Tentarei dar um jeito rs..

Muito obrigado pela atenção!
Até mais.
avatar

Kvothe
Usuário destaque

Masculino
Inscrito dia : 22/12/2012
Mensagens : 945
Pontos Ativos : 1372

Ver perfil do usuário http://landofhaeron.forumeiros.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