Menu Accordion com JQuery

[Thiago Bittencuort 0]

Galera, estou tentando fazer um menu do tipo accordion com jquery usando as tags dl, dt e dd. Porém tem um pequeno problema: quando um elemento dt não tem nenhum dd dentro, ele não funciona como um link normal. Como eu devo fazer?

 

Segue abaixo o código:

 

<script type="text/javascript">
	$(document).ready(function(){
		$('dd').hide();
		$('dt a').click(function(){
			$("dd:visible").slideUp("normal");
			$(this).parent().next().slideDown("normal");
			return false;
		});
	});
</script>

<dl>
    <dt><a href="index.html">HOME</a></dt>
    <dt><a href="#">PROGRAMAÇÃO</a></dt>
	<dd>
        <ul>
            <li><a href="#">Mesas | Entrevistas</a></li>
            <li><a href="workshops.html">Workshops</a></li>
            <li><a href="#">Exposições</a></li>
            <li><a href="#">Calendário</a></li>
        </ul>
        </dd>
    <dt><a href="#">ESPAÇOS</a></dt>
    <dd>
    <ul>
    	<li><a href="#">Casa da Cultura</a></li>
        <li><a href="#">Tenda Matriz</a></li>
        <li><a href="#">Espaços Workshops</a></li>
        <li><a href="#">Espaços Exposições</a></li>
    </ul>
    </dd>
    <dt><a href="#">INSCREVA-SE</a></dt>
    <dt><a href="#">AÇÕES SOCIAIS</a></dt>
    <dt><a href="historico.html">HISTÓRICO</a></dt>
    <dt><a href="#">IMPRENSA</a></dt>
    <dt><a href="#">INFORMAÇÕES ÚTEIS</a></dt>
    <dt><a href="#">EQUIPE</a></dt>
    <dt><a href="#">FALE CONOSCO</a></dt>
</dl>

Obrigado e abraços!

[Roniesds 0]

Os links da Home e do Histórico não estão funcionando por causa do return false;

 

Como está

$('dt a').click(function(){
                        $("dd:visible").slideUp("normal");
                        $(this).parent().next().slideDown("normal");
                        return false;
                });

Isto diz que para cada click nos <a> dentro dos dt ele vai fazer o slide e retorna false, antes de executar o href.

 

Tenta assim tirando o return false; aqui funcionou no seu código.

$('dt a').click(function(){
                        $("dd:visible").slideUp("normal");
                        $(this).parent().next().slideDown("normal");
                });