Sobre categoria que se retrai

Qual é minha questão:
Olá amigos, apenas necessito o link do tutorial, ou alguem que saiba me explicar como fazer uma categoria retrátil, por exemplo á desse fórum: http://www.power-pixel.net/

Quero ter acesso ao efeito, para aprimorar.
Aguardo.

Jpjupa.

Endereço do meu fórum:
https://ajuda.forumeiros.com

Versão do fórum:
PHPBB3

Olá querido!

Adicione este código em sua "Gestão de Javascript"

Código:

jQuery(document).ready(function(){
    jQuery('.main .main-head').append('<span style="display:none" class="contar2">1</span>');
    jQuery('.main .main-head').css('cursor','pointer');
    jQuery('.main .main-head').attr('title','Fechar Categoria Abaixo');
    jQuery('.main .main-head').click(function(){
    if(jQuery(this).find('.contar2').text() == "1"){
    jQuery(this).next('.main-content').slideUp();
    jQuery('.main .main-head').attr('title','Mostrar Categoria Abaixo');
    jQuery(this).find('.contar2').text('2');
    }else{
    jQuery(this).next('.main-content').slideDown();
    jQuery('.main .main-head').attr('title','Fechar Categoria Abaixo');
    jQuery(this).find('.contar2').text('1');
    }
    });
    });

Investimentos: Em todas as página
Confirmar.
Só lembrando, basta click na barra da categoria que ele minimiza, dai para maximizar novamente basta click na barra de categoria.

Até.

Esse não é o código usado pelo power pixel.
Preciso do mesmo.

Mas obrigado pela intenção.
Aguardo.

Jpjupa.

Saudações!

Vá em Painel de controle ->> Módulos ->> HTML e Javascripts ->> Gestão dos códigos Javascripts ->>
Crie um novo Javascript, e em "investimento" marque a opção "Todas as páginas". Coloque o código abaixo no campo código javascript:

Código:

function EsconderCategoriaFeitoPorSupero(cid,iflag){var cat=document.getElementById(cid);var button=document.getElementById('b'+cid);if(cat.style.display=='none'){cat.style.display='block';button.className='contract';my_setcookie('_'+cid,'',true)}else{cat.style.display='none';button.className='expand';my_setcookie('_'+cid,'1',true)}}$(function(){x=$('ul.topiclist li.header').get();for(i=0;i<x.length;i++){x[i].style.position='relative';var cid='c'+String(i+1);x[i].parentNode.nextSibling.setAttribute('id',cid);x[i].parentNode.nextSibling.style.display='block';var y='<div id="b'+cid+'" class="contract" onclick="EsconderCategoriaFeitoPorSupero(\''+cid+'\');"></div>';x[i].innerHTML=x[i].innerHTML+y}cookies=document·cookie.split('; ');for(i in cookies){if(cookies[i].charAt(0)=='_'){cookie=cookies[i].split('=');if(cookie[1]=='1'){cid=cookie[0].substring(1);if(document.getElementById(cid)){EsconderCategoriaFeitoPorSupero(cid,'x')}}}}});

Depois Painel de controle ->> Visualização ->> Imagens e Cores ->> Cores ->> Folha de estilo CSS ->>
Coloque o seguinte CSS na folha de estilo:

Código:

.contract,.expand{background:url(http://2img.net/i/fa/m/tabs_more1.gif);cursor:pointer;height:9px;position:absolute;right:10px;top:6px;width:9px}.contract{background:url(http://2img.net/i/fa/m/tabs_less1.gif)}

Obs.: Caso o código .js não funcione, pegue-o diretamente desta página:
https://ajuda.forumeiros.com/12944.js


Passar Bem!

Olá, desculpe não avisar.
Já peguei o código do power pixel e fiz o efeito desejado.

Não precisei de suporte.

Obrigado!
Jpjupa.