ShiftActif fórum

Categoria retrátil Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo Categoria retrátil 405374159 ao fórum de suporte e de informações técnicas ShiftActif. Aqui, solucionamos suas dúvidas sobre os tutoriais exclusivos fornecidos pela nosso subfórum de tutoriais além de suporte opcional ao Forumeiros.com, Blogger e temas grátis do Criarumblog.com! Você encontrará FAQs, astúcias em códigos e efeitos especiais em CSS, Javascript e outros para complementar seu fórum ou Blog!
Venha participar desta grande comunidade!!! Categoria retrátil 1660898911
ShiftActif fórum

Categoria retrátil Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo Categoria retrátil 405374159 ao fórum de suporte e de informações técnicas ShiftActif. Aqui, solucionamos suas dúvidas sobre os tutoriais exclusivos fornecidos pela nosso subfórum de tutoriais além de suporte opcional ao Forumeiros.com, Blogger e temas grátis do Criarumblog.com! Você encontrará FAQs, astúcias em códigos e efeitos especiais em CSS, Javascript e outros para complementar seu fórum ou Blog!
Venha participar desta grande comunidade!!! Categoria retrátil 1660898911

Categoria retrátil

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

Resolvido Categoria retrátil

Mensagem por Consolado Seg 31 Dez - 11:43

Qual é sua questão:
Bom dia pra quem é de dia, boa tarde pra quem é de tarde e boa noite pra quem é de noite! A versão Invision possui um tipo de categoria inovadora, que permite que você contraia e descontraia quando desejar, o que torna a página mais limpa e de fácil visualização. Eu gostaria de um meio para colocar esse recurso em meu fórum, a categoria retrátil, para que quando clicarmos no ícone ela fechar-se. Preciso da ajuda de vocês. Sucesso a ShiftActif e Happy New Year for all!

Endereço e versão do meu fórum:
PHPBB3

Apresente-nos imagens do problema (se necessário):
Não é necessário.
Consolado

Consolado
Colaborador Actif

PointActif's : 4663
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%

http://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

Mensagem por StyLe® Seg 31 Dez - 11:47

Também quero obter o efeito, vou postar aqui para ficar gravado no meu /sta
StyLe®

StyLe®
Colaborador Actif

Masculino
Idade : 36
PointActif's : 4397
ReputActifs : 14
Mensagens : 205
Inscrição : 17/11/2012

Localização : SA, FDF, SPD, SHD
100%

Resolvido Re: Categoria retrátil

Mensagem por Shek Seg 31 Dez - 11:56

Olá!

Você pode seguir os passos do seguinte tutorial: http://ajuda.forumeiros.com/t26394-tutorial-efeito-opacidade-no-forum-fad-in

Atenciosamente,



Staff Shiftactif

Bem-vindo a comunidade ShiftActif!
Leia as regras do fórum.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Administrador

Masculino
Idade : 30
PointActif's : 7411
ReputActifs : 97
Mensagens : 2777
Inscrição : 13/04/2011

Localização : Vilhena - RO
100%

https://shiftactive.blogspot.com/

Resolvido Re: Categoria retrátil

Mensagem por Consolado Seg 31 Dez - 12:19

What? Desculpe, não encontrei nada relacionado nesse tutorial. Nesse também não: http://ajuda.forumeiros.com/t23387-tutorial-criar-uma-categoria-retratil#137729

O código desse tutorial não funciona em meu fórum. Muito menos sem as tags <script></script>.

Obrigado e sucesso a ShitActif.
Consolado

Consolado
Colaborador Actif

PointActif's : 4663
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%

http://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

Mensagem por MateusV. Seg 31 Dez - 14:14

Olá,

Crie um novo código javascript com o investimento marcado "No índice" e com este código:
Código:
jQuery(document).ready(function(){jQuery('.forabg li.header').each(function(){jQuery(this).append('<img src="http://2img.net/i/fa/m/tabs_less1.gif" id="abrirf" />');jQuery(this).find('#abrirf').click(function(){var i=jQuery(this).closest('.forabg').find('.topiclist.forums');if(i.css('display')=='none'){i.fadeIn();jQuery(this).find('#abrirf').attr('src','http://2img.net/i/fa/m/tabs_less1.gif');}else{i.fadeOut();jQuery(this).find('#abrirf').attr('src','http://2img.net/i/fa/m/tabs_more1.gif');}});});});

Feito isto adicione este código em seu CSS:
Código:
#abrirf {
float: right;
margin-top: -20px;
margin-right: 10px;
}

Melhores cumprimentos.
MateusV.

MateusV.
Membro em destaque

Masculino
Idade : 25
PointActif's : 4602
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%

http://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

Mensagem por Consolado Seg 31 Dez - 14:23

Certíssimo Mateus, mais o ícone não muda. Quando é pra fecharmos, aparece um sinal, um hífen. Mas quando é pra abrir continua assim ao invés de um "+".
Consolado

Consolado
Colaborador Actif

PointActif's : 4663
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%

http://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

Mensagem por MateusV. Seg 31 Dez - 14:28

Olá,

Eu havia esquecido de colocar uma coisa no código Pancada

Substitua por:
Código:
jQuery(document).ready(function(){jQuery('.forabg li.header').each(function(){jQuery(this).append('<img src="http://2img.net/i/fa/m/tabs_less1.gif" id="abrirf" />');jQuery(this).find('#abrirf').click(function(){var i=jQuery(this).closest('.forabg').find('.topiclist.forums');if(i.css('display')=='none'){i.fadeIn();jQuery(this).attr('src','http://2img.net/i/fa/m/tabs_less1.gif');}else{i.fadeOut();jQuery(this).attr('src','http://2img.net/i/fa/m/tabs_more1.gif');}});});});
MateusV.

MateusV.
Membro em destaque

Masculino
Idade : 25
PointActif's : 4602
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%

http://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

Mensagem por Consolado Seg 31 Dez - 14:33

Consegui alterar as imagens que você colocou. Obrigado. Só mais uma coisa, tem como que eles sejam exibidos somente depois que colocar o mouse sobre a determinada categoria? Em modo hover.
Consolado

Consolado
Colaborador Actif

PointActif's : 4663
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%

http://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

Mensagem por MateusV. Seg 31 Dez - 14:36

Adicione em seu CSS:
Código:
#abrirf {
    display: none;
}
.forabg :hover #abrirf {
    display: block;
}

Abraços.
MateusV.

MateusV.
Membro em destaque

Masculino
Idade : 25
PointActif's : 4602
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%

http://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

Mensagem por Consolado Seg 31 Dez - 14:42

Eu substitui ".forabg :hover" por ".forabg .header:hover" e ficou como eu queria. Obrigado.
Consolado

Consolado
Colaborador Actif

PointActif's : 4663
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%

http://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

Mensagem por Conteúdo patrocinado


Conteúdo patrocinado


Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos