ShiftActif fórum


Participe da melhor comunidade sobre fóruns!

Bem vindo 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!!!
Compartilhe
Ver o tópico anteriorIr em baixoVer o tópico seguinte
avatar
Colaborador Actif
PointActif's : 2196
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%
Ver perfil do usuáriohttp://papo-geek.forumado.net/

Resolvido Categoria retrátil

em 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.
avatar
Colaborador Actif
Masculino
Idade : 29
PointActif's : 1930
ReputActifs : 14
Mensagens : 205
Inscrição : 17/11/2012

Localização : SA, FDF, SPD, SHD
100%
Ver perfil do usuário

Resolvido Re: Categoria retrátil

em Seg 31 Dez - 11:47
Também quero obter o efeito, vou postar aqui para ficar gravado no meu /sta
avatar
Adminactif
Adminactif
Masculino
Idade : 23
PointActif's : 4813
ReputActifs : 97
Mensagens : 2707
Inscrição : 13/04/2011

Localização : Vilhena - RO
100%
Ver perfil do usuáriohttp://www.shiftactif.com/

Resolvido Re: Categoria retrátil

em 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 ao fórum ShiftActif. Aconselhamos que você veja alguns subfóruns e regras para iniciar sua carreira na comunidade.
Regulamento e informações afins:
Seta verde   Condições gerais de uso & equipe voluntária.
Seta verde Necessidade de um Adminactif ou Deveolper?
Seta verde Lista de tutoriais.
Seta verde Aumente a segurança do seu fórum.
Fóruns interessantes:
Seta verde Tutoriais especiais.
Seta verde JuriActif.
Seta verde Suporte ao usuário ShiftActif.
Seta verde Sugestões & Melhoras.
Serviços extras:
Seta verde Exclusão de temas do Hitskin.
Seta verde Desinscrever-se de um fórum.
Seta verde Temas grátis para Download.
avatar
Colaborador Actif
PointActif's : 2196
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%
Ver perfil do usuáriohttp://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

em 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.
avatar
Meriteiro
Meriteiro
Masculino
Idade : 18
PointActif's : 2135
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%
Ver perfil do usuáriohttp://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

em 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://illiweb.com/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://illiweb.com/fa/m/tabs_less1.gif');}else{i.fadeOut();jQuery(this).find('#abrirf').attr('src','http://illiweb.com/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.
avatar
Colaborador Actif
PointActif's : 2196
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%
Ver perfil do usuáriohttp://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

em 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 "+".
avatar
Meriteiro
Meriteiro
Masculino
Idade : 18
PointActif's : 2135
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%
Ver perfil do usuáriohttp://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

em 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://illiweb.com/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://illiweb.com/fa/m/tabs_less1.gif');}else{i.fadeOut();jQuery(this).attr('src','http://illiweb.com/fa/m/tabs_more1.gif');}});});});
avatar
Colaborador Actif
PointActif's : 2196
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%
Ver perfil do usuáriohttp://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

em 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.
avatar
Meriteiro
Meriteiro
Masculino
Idade : 18
PointActif's : 2135
ReputActifs : 53
Mensagens : 179
Inscrição : 22/04/2012

Localização : Baker street
100%
Ver perfil do usuáriohttp://narutorpgstorm.ultimaterpg.net/forum

Resolvido Re: Categoria retrátil

em Seg 31 Dez - 14:36
Adicione em seu CSS:
Código:
#abrirf {
    display: none;
}
.forabg :hover #abrirf {
    display: block;
}

Abraços.
avatar
Colaborador Actif
PointActif's : 2196
ReputActifs : 28
Mensagens : 243
Inscrição : 19/04/2012

100%
Ver perfil do usuáriohttp://papo-geek.forumado.net/

Resolvido Re: Categoria retrátil

em Seg 31 Dez - 14:42
Eu substitui ".forabg :hover" por ".forabg .header:hover" e ficou como eu queria. Obrigado.
Ver o tópico anteriorVoltar ao TopoVer o tópico seguinte
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum