Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Categorias em abas que fecham/abrem

+2
[S]herlock H.
Minatoevox
6 participantes

Minatoevox Minatoevox  • Qui 28 Mar 2013 - 23:24

Categorias em abas que fecham/abrem Empty Categorias em abas que fecham/abrem Qui 28 Mar 2013 - 23:24

Ola a todos pessoal. Bem o que eu queria e o seguinte: vi um efeito eem vários foruns logo acima das categorias, que ao clicar nuns botões, as categorias apareçem/desapareçem, tipo em abas. Gostava que ficasssem do genero deste forum: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] (aqueles botões de RPG, REINOS; TREINOS, etc..)


Podem me ajudar? Obrigado Wink

Minatoevox Minatoevox  • Sáb 30 Mar 2013 - 10:15

[S]herlock H. [S]herlock H.  • Sáb 30 Mar 2013 - 10:18

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Sáb 30 Mar 2013 - 10:18

Olá,

Não entendi muito sua questão,veja se é isto que o senhor quer :

Seta 2 [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Até.

Minatoevox Minatoevox  • Sáb 30 Mar 2013 - 10:28

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Sáb 30 Mar 2013 - 10:28

Ola

Caro iKnight o efeito que procuro não é o que me passas-te no tutorial. Vou-me explicar melhor: no forum que indiquei no primeiro post tem alguns botões de cor preta que ao clicar neles fazem apareçer uma certa zona das categorias, desapareçendo as outras e ficando o forum muito mais curto e arrumado. Vejam na imagem e cliquem nos botões indicados na caixa vermelha para entenderem melhor: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Minatoevox Minatoevox  • Dom 31 Mar 2013 - 10:44

[Dark]Doki-. [Dark]Doki-.  • Dom 31 Mar 2013 - 12:15

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Dom 31 Mar 2013 - 12:15

Olá! Eu tinha começado a adaptar o codigo pra você, mais não consegui grandes resultados :c vou ver se o daemon me ajuda com o codigo.
Veja como está ficando : [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Minatoevox Minatoevox  • Dom 31 Mar 2013 - 20:50

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Dom 31 Mar 2013 - 20:50

Os botões em css estão optimos Doki. Agora apenas falta conseguirem abrirem e fechas as categorias.. Eu falei com o dono do forum e ele disse-me que o codigo em questão culmina css, html e edição de template

Obrigado Wink

Minatoevox Minatoevox  • Seg 1 Abr 2013 - 22:21

[Dark]Doki-. [Dark]Doki-.  • Ter 2 Abr 2013 - 3:59

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Ter 2 Abr 2013 - 3:59

Olá! Eu falei com o dono do forum que possui o código. ele disse que dentro de alguns dias uteis me passará o codigo.
Peço que aguarde Smile

Minatoevox Minatoevox  • Ter 2 Abr 2013 - 10:42

Minatoevox Minatoevox  • Qua 3 Abr 2013 - 5:59

Minatoevox Minatoevox  • Sex 5 Abr 2013 - 11:32

Minatoevox Minatoevox  • Qua 10 Abr 2013 - 20:26

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Qua 10 Abr 2013 - 20:26

UP. Já algum tempo que está aberto, podem dar uma ajuda por favor?

Minatoevox Minatoevox  • Sex 12 Abr 2013 - 9:40

Minatoevox Minatoevox  • Sáb 13 Abr 2013 - 10:54

binho binho  • Sáb 13 Abr 2013 - 14:20

Categorias em abas que fecham/abrem Empty Olá, crie um widget Sáb 13 Abr 2013 - 14:20

Olá,
Amigo crie um Widget e cole o seguinte código:
Código:
<script>jQuery(document).ready(function(){var p=0,u='http://i15.servimg.com/u/f15/18/08/53/97/collap10.png',v='http://i15.servimg.com/u/f15/18/08/53/97/collap11.png';jQuery('.main.module .main-head').each(function(){jQuery(this).next().attr('id',p);jQuery(this).next().css('display',my_getcookie('cat-'+jQuery(this).next().attr('id')));jQuery(this).append('<img src="'+u+'" id="abrirf" style="float: right;margin-right: -1px;margin-top: -16px;"/>');jQuery(this).find('#abrirf').click(function(){var i=jQuery(this).closest('.main-head').next();if(i.css('display')=='none'){i.slideToggle();jQuery(this).attr('src',u);my_setcookie('cat-'+jQuery(this).closest('.main-head').next().attr('id'),'block',1,0)}else{i.slideToggle();jQuery(this).attr('src',v);my_setcookie('cat-'+jQuery(this).closest('.main-head').next().attr('id'),'none',1,0)}});p++})});</script>

Resultou ?
Agradesça.

Stronda™ Stronda™  • Sáb 13 Abr 2013 - 14:22

Minatoevox Minatoevox  • Sáb 13 Abr 2013 - 14:25

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Sáb 13 Abr 2013 - 14:25

Ola

Caro Binho, o código não fez nada :s

Stronda ja outro membro tinha falado nesse tutorial, mas é esse efeito que quero. Peço que leiam o primeiro post e vejam as imagens que postei para entenderem o que pretendo

Obrigado aos dois Wink

binho binho  • Sáb 13 Abr 2013 - 14:45

Categorias em abas que fecham/abrem Empty Re : nao del efeito Sáb 13 Abr 2013 - 14:45

Amigo, então aguarde pois ha um tópico com esse tipo de tutorial irei procurar e asism te passo.

binho binho  • Sáb 13 Abr 2013 - 14:47

Categorias em abas que fecham/abrem Empty Olá aqui está Sáb 13 Abr 2013 - 14:47

Bom veja esse tutorial.
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Fuis !

ηємєsis ηємєsis  • Sáb 13 Abr 2013 - 20:47

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem Sáb 13 Abr 2013 - 20:47

Reputação da mensagem: 100% (1 votos)
Eu também estou louca por este código a tempos, e tenho um aqui que consegui em um tutorial, o único problema é que ele está meio bugado. =\
Se alguma boa alma pudesse dar uns ajustes e consertar... Agradeceria muito!

Aqui está:

Adicone no JS (investimento em todas as páginas)


Código:
function tttf(n) {
var tables = document.getElementById("main-content").getElementsByTagName("table")[n].parentNode;
document.getElementById("ttid").innerHTML = tables.innerHTML;
}
$(function() {
if (location.pathname=="/forum" || location.pathname=="/") {
var tables = document.getElementById("main-content").getElementsByTagName("table");
var tf = document.getElementById("main-content");
var ttab = document.createElement("ul");
ttab.setAttribute("id","ttcl");
for (i=0; i<tables.length; i++) {
tables[i].parentNode.style.display="none";
tables[i].parentNode.previousSibling.style.display="none";
ttab.innerHTML
 += "<li><a href='javascript:void(0);' onclick='tttf(" + [i] +
")'>" +
tables[i].parentNode.previousSibling.childNodes[0].childNodes[0].innerHTML
 + "</a></li>";
tf.parentNode.insertBefore(ttab,tf);
}
var tl = document.createElement("div");
tl.innerHTML = "<div id='ttid'>Click on the above tabs to choose a category!</div>";
tf.parentNode.insertBefore(tl,tf);
}
});

CSS

Código:
#ttcl {
display: block;
list-style-type: none;
margin: 10px 0px 10px 0px;
}
#ttcl li {
display: inline;
padding: 5px;
margin: 0px 0px 0px 5px;
background: #FFFFFF;
border-radius: 5px;
border: 1px solid #000000;
}
#ttid {
display: block;
background: #FFFFFF;
border-radius: 5px;
border: 1px solid #000000;
padding: 5px;
margin: 5px;
}

PS: Se o seu template for editado pode ser que não funcione.

Conteúdo patrocinado  • 

Categorias em abas que fecham/abrem Empty Re: Categorias em abas que fecham/abrem

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