Categoria retrátil

Qual é minha questão:
Bom eu estou afazendo as Categorias/Fóruns,e eu reparei que estou achando muito grande a quantidade mesmo eu tendo diminuido muito.Eu achei no tutorial só como Ocultar Widget,mas eu quero poder Ocultar as Categorias,Alguém pode me dizer como fasso isso?

Medidas que eu tomei para corrigir o problema:
não sei

Links e imagens do meu problema:


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

Versão do meu fórum:
PHPBB3

Olá , siga os paços abaixo :

Primeiramente , aceda à

Painel de Controle Visualização Imagens e Cores Cores Folha de estilo CSS

Copie e cole o código , depois clique em "validar"

Código:

.contract,.expand{background:url(http://i81.servimg.com/u/f81/11/91/65/81/plus10.png);cursor:pointer;height:15px;position:absolute;right:10px;top:6px;width:15px}
.contract{background:url(http://i81.servimg.com/u/f81/11/91/65/81/minus10.png)}

Painel de Controle Módulos HTML & JAVASCRIPT Gestão dos Códigos JavaScript

Criar um novo Javascript

Título * : A escolha

Investimento : Marque " Em todas as páginas "

Código:

<script type="text/javascript">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')}}}}});</script>

Resulta ?

Até mais.

!sasuky,infelizmente não deu certo

Olá, leia o conteúdo deste tutorial
https://ajuda.forumeiros.com/t23387-
Cordialmente.

Verifique se o " gerenciamento dos códigos JavaScript " esta habilitado !

Aceda à : Painel de Controle -> Módulos HTML & JAVASCRIPT -> Gestão dos Códigos JavaScript

Habilitar o gerenciamento dos códigos JavaScript : Marque " sim "

ele já esta habilitado.

Não deu certo... o "-" não aparece ao lado da categoria....ou e outra forma de ocultar as categorias?

Verifique se no código JavaScript você adicionou isto :

Investimento : Marque " Em todas as páginas "

Sim marquei...

desculpe acho que achei o problema,eu não tenho a imagem do sinal + e -

alguém poderia me informar uma imagem que se pode utilizar ou um tamanho para eu mesmo fazer?

Painel de Controle :seta Visualização Imagens e Cores :seta Cores Folha de estilo CSS

.contract,.expand{background:url(https://i.servimg.com/u/f81/11/91/65/81/plus10.png);cursor:pointer;height:15px;position:absolute;right:10px;top:6px;width:15px}
.contract{background:url(https://i.servimg.com/u/f81/11/91/65/81/minus10.png)}

Copie e cole o código , depois clique em "validar"

Vermelho : Link da imagem.
Verde : Tamanho em pixels da imagem.

Resulta ?

Até mais.

Bom coloquei o CSS e coloquei nos mini icones,mas não apareceu T-T

Tente refazer o tutorial que eu postei !
Talvez você tenha feito alguma coisa errada.

Olá, as imagens são pequenas e discretas veja se já não esta funcionando.

Caso não, substitua o codigo por este

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;z-index: 999 !important;}
.contract{background:url(http://2img.net/i/fa/m/tabs_less1.gif); z-index: 999 !important;}

Cordialmente.

os icones que coloquei antes estão funcionando nos amigos.vou mudar para as imagens que mateusV. mostrou no código...

Bom estão funcionando em outros locais.Como no votar,Amigos e ignorados,mas nada de categorias.

Desculpem o flod,talvez possa ser a largura das categorias/fóruns ?

UP..Pelo visto n tem resposta do por que não esta funcionando no meu fórum -.-

Olá , você adicionou este código :

Código:

<script type="text/javascript">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')}}}}});</script>

Em uma página Javascript e este código

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;z-index: 999 !important;}
.contract{background:url(http://2img.net/i/fa/m/tabs_less1.gif); z-index: 999 !important;}

Em sua Folha CSS ?

Olá, talvez seja seu CSS, poderia manda-lo aqui no topico?
Cordialmente.

!Sasuky sim ja coloquei

Mateus V...Aqui estar meu CSS

Código:


em{
font-style: normal;
}
.module .box-content, .module, .module .main-content {
background-image: url('http://i55.tinypic.com/wir18y.png') !important;
background-repeat:no-repeat !important;
background-position: center top !important;
background-color: #FFFFFF !important;
}

.module .postbody .postbody-head {
background-color: #e5e6e7;
}

.post-footer {
background-color: #CCCCCC;
}

.post .post-header {
background-color: #CCCCCC;
}




.online {background-image: url(http://2img.net/i/fa/prosilver/icon_user_online_en.png);
background-repeat: no-repeat;
background-position: 100% 0%;
}

a[href="/u1"] {
background: url('http://i45.servimg.com/u/f45/15/95/60/34/glitte10.gif');
text-shadow: 0px 0px 5px #ff00d8;
}

a{
    color: #cccccc;
    -webkit-transition:all 1s ease-in;
    -moz-transition:all 1s ease-in;
    -o-transition:all 1s ease-in;
    transition:all 1s ease-in;
    }
    a:hover{
    color: #00000;
    -moz-text-shadow: 0 0 0 10px white;
    -webkit-text-shadow: 0 0 0 10px white;
    text-shadow: 0 0 0 10px white;

    }
.forumbg{background-color:#a50165;background-image:url(http://i43.tinypic.com/211jdyd.png);background-position:0 0;background-repeat:repeat-x;border:2px solid #;clear:both;margin-bottom:4px;padding:0 5px;
-moz-border-radius: 5px;
-webkit-border-radiu: 5px;}
.forabg{background-color:#a50165;background-image:url(http://i43.tinypic.com/211jdyd.png);background-position:0 0;background-repeat:repeat-x;border:2px solid #;clear:both;margin-bottom:4px;padding:0 5px;
-moz-border-radius: 5px;
-webkit-border-radiu: 5px;}
.forumbg {
-moz-border-radius:5px;-webkit-border-radius:5px;
}
.forabg {
-moz-border-radius:5px;-webkit-border-radius:5px;
}

.vote {
float: right;
margin-left: 4px;
width: 9px;
}
.vote .vote-button {
font-weight: 700;
margin-left: -1px;
text-align: center;
}
.vote .vote-button a {
text-decoration: none !important;
}
.vote .vote-bar {
border: 1px solid #666666;
font-size: 0;
height: 50px;
margin: 0 auto;
width: 3px;
}
.vote .vote-no-bar {
letter-spacing: -2px;
margin-left: -2px;
white-space: nowrap;
}
.vote .vote-bar-plus {
background-color: #00FF00;
}
.vote .vote-bar-minus {
background-color: red;
}

div.vote-count {
background: url("sd-1.archive-host.com/membres/images/142586199450897653/FDF/button_count.png") no-repeat scroll 0 0 transparent;
color: #4AAE00;
font-size: 10px;
font-weight: 700;
height: 17px;
padding-top: 2px;
text-align: center;
width: 27px;
}
td.post-options li, ul.profile-icons li, .post-options li, .post-footer ul.misc-icons li{
color: transparent;
}

blockquote {
border-color: #bcb6b6;
background-color: #e2dada;
}

ul.topiclist li.row dl {
widght: 100px;
height: 100px;
}
body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1020.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1020.png), progress !important;}


vermelho{
color: red;
text-shadow: 0 0 5px red;
}
vermelhoescuro{
color: darkred;
text-shadow: 0 0 5px darkred;
}
laranja{
color: orange;
text-shadow: 0 0 5px orange;
}
marrom{
color: brown;
text-shadow: 0 0 5px brown;
}
amarelo{
color: yellow;
text-shadow: 0 0 5px yellow;
}
verde{
color: green;
text-shadow: 0 0 5px green;
}
azeitona{
color: olive;
text-shadow: 0 0 5px olive;
}
ciano{
color: cyan;
text-shadow: 0 0 5px cyan;
}
azul{
color: blue;
text-shadow: 0 0 5px blue;
}
azulescuro{
color: Darkblue;
text-shadow: 0 0 5px Darkblue;
}
indigo{
color: indigo;
text-shadow: 0 0 5px indigo;
}
violeta{
color: purple;
text-shadow: 0 0 5px purple;
}
branco{
color: white;
text-shadow: 0 0 5px white;
}
preto{
color: black;
text-shadow: 0 0 5px black;
}
rosa{
color: pink;
text-shadow: 0 0 5px pink;
}
cardo{
color: #d8bfd8;
text-shadow: 0 0 5px thistle;
}
escuroazeitonaverde{
color: #556b2f;
text-shadow: 0 0 5px darkolivegreen ;
}
marromrosado{
color: #bc8f8f;
text-shadow: 0 0 5px rosybrown ;
}

blockquote, blockquote blockquote, blockquote blockquote blockquote {
-moz-border-radius: 6px;
-moz-box-shadow: 2px 2px 2px red;
-webkit-border-radius: 6px;
-webkit-box-shadow: 2px 2px 2px red;
background: -moz-linear-gradient(#F2F2F2,white);
background-color: white;
background-image: -webkit-linear-gradient(#F2F2F2,white);
border: 1px solid HotPink;
border-radius: 6px;
box-shadow: 2px 2px 2px HotPink;
font-size: 11px;
margin: 0;
padding-bottom: -30px;
padding-left: -30px;
padding-top: -30px;
width: 90%;
}


    .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;z-index: 999 !important;}
    .contract{background:url(http://2img.net/i/fa/m/tabs_less1.gif); z-index: 999 !important;}

Olá, poderia retirar seu forum de manutenção? Se não for incomodar claro..
Cordialmente.

Retirado

Olá, substitua o codigo CSS do tutorial por este

Código:

li.header dd, li.header dt, .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;z-index: 999 !important;}
li.header dd, li.header dt,.contract{background:url(http://2img.net/i/fa/m/tabs_less1.gif); z-index: 999 !important;}

Cordialmente.

Os titulos das categorias sumiu e.e

Up ( Mateus eu retirei o código pois ele fez o titulo da categoria sumir )

Olá,

Aceda a:
Painel de Controle -> Módulos -> HTML & JAVASCRIPT -> Gestão das páginas Javascript
Marque o investimento em todas as páginas.
E no código, coloque o seguinte código que se encontra no link abaixo. Deves pegá-lo lá na fonte:
https://ajuda.forumeiros.com/12595.js
Depois aceda em:
Painel de Controle -> Visualização -> Imagens e Cores -> Cores / Folha de estilo CSS

E adicione o seguinte código CSS:

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)}

Resulta?
Cordialmente.

Resutooooo , OBRIGADO,Topico resolvido