Comments on: Como fazer Accordion Simples com jQuery em 5 linhas de código

By: Marcelo

Marcelo — Fri, 11 Nov 2011 01:32:18 +0000

Olá Danilo,

O seu código é bem fácil, mas o mesmo apresenta problemas quando se usa ele com 2 accordions seguidos no IE7.
Quando se clica no h3, o IE reage quebrando os espaços entre os accordions, deixando colocados… é como se desse um erro e a estrutura css que amarra os accordions se quebrasse e tudo ficasse agarrado. No Chrome e no FF funciona perfeitamente.
Sabe me dizer se existe algum recurso para corrigir isso no IE ?

Abraços,
Marcelo.

By: Rafael

Rafael — Tue, 08 Nov 2011 11:13:52 +0000

Cara, seu exemplo ficou muito bom.
Apenas uma sugestão:
Na linha:
$(this).parent().find(‘div.accordion’).slideToggle(“slow”);
Eu gostaria de trocar por:
$(this).next(‘div.accordion’).slideToggle(“slow”);

Na forma que está especificado eu tive problemas no chrome ao utilizar mais de 1 elemento de listagem (no seu caso o h2 e a div). Ao executar o segundo ou o terceiro, ele forçava o primeiro grupo a ser exibido. usando next contornei o problema. Abraço e muito obrigado!

By: Gabriel

Gabriel — Fri, 28 Oct 2011 19:04:13 +0000

Cara, procurei uma solução dessa por horas! A tua foi excelente, to fazendo um menu com o wp_list_categories do wordpress com ela pra ficar collapsible. Mto obrigado!

By: Felipe

Felipe — Fri, 28 Oct 2011 10:39:45 +0000

Eu baixei o jquery mas nao funcionou. Voce pode disponibilizar o arquivo para download?

By: Will

Will — Mon, 03 Oct 2011 17:07:54 +0000

Nossa muito obrigado!!!! valeu cara

By: Como fazer Accordion Simples com jQuery em 5 linhas de código : FernandoMoreira - Webdesigner e Programador

Thu, 22 Sep 2011 14:44:30 +0000

[...] Fonte: tidbits.com.br [...]

By: jonathan silva

jonathan silva — Thu, 18 Aug 2011 19:16:57 +0000

Muito bom esse tutorial, estava aqui tentando implementar esse tipo de accordion na versão mobile do portal do tribunal, e utilizando plugins cheios de kb, quando eis que encontro esse simples tutorial.Perfeito. Muito obrigado kra por compartilhar esse tutorial.

By: Fábio

Fábio — Tue, 15 Mar 2011 16:49:20 +0000

Olá, muito bom tutorial, funciona de forma perfeita e é muito simples de implementar e personalizar.

Obrigado pela dica.

By: Patricia Gil

Patricia Gil — Fri, 25 Feb 2011 21:09:31 +0000

Parabénssss!!
Ótimo tutorial, simples, fácil e ágil.
Já implementei no site :)

Abs

By: Guilherme Barbosa

Guilherme Barbosa — Wed, 06 Oct 2010 18:50:51 +0000

Muito bacana.
Só uma correção: o termo Accordion é usado quando um item some para o outro aparecer. A forma que você mostrou é mais conhecida como hide/show ou algo assim.