[SOLUCIONADO] Acordeón JQuery

diegoguerrero · #1 (**permalink**) 13/02/2015, 08:49

Imágenes:
Imagen 1:

Imagen 2:

Buenas: Tengo el acordeón de la imagen de arriba 1 que, siempre que se entra a la web, se abre como se ve. En la imagen 2 se ve el acordeón con la propiedad collapsible y lo he cerrado yo. ¿Cómo puedo hacer que cuando se abra la página lo haga automáticamente como en la imagen 2 y no como en la 1? Gracias.

Flow89 · #2 (**permalink**) 13/02/2015, 12:48

Pon el código que tienes para que podamos ayudarte...

diegoguerrero · #3 (**permalink**) 13/02/2015, 12:56

Código HTML:

Ver original<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Dpto. de Ciencias Sociales</title>
<link href="jquery/jquery-ui.css" rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/jquery-1.10.1.js"></script>
<script src="jquery/jquery-ui.js"></script>
<script>
  $(function() {
    $( "#cursos" ).accordion({
      collapsible: true,
      heightStyle: "content"
    });
  });
</script>
</head>
<body>
<table border="0" bgcolor="#FFFFFF" bordercolor="#FFFFFF" align="center" width="100%">
<tr>
<td width="10%" align="center" valign="middle"><a href="javascript:window.history.back();"><div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:20px">Volver</font></p></div></a></td>
<td width="90%" align="center" valign="middle"><div id="caja-ccss"><p align="center"><font id="h1-ccss">Departamento de Ciencias Sociales</font></p></div></td></tr></table>
<div id="h2-caja"><h2 id="h2" style="color:#F39909">Cursos</h2></div>
<table width="90%" border="0" align="center">
<tr>
<td width="90%" align="center" valign="middle">
<div id="cursos">
<h3>1<sup>er</sup> ciclo ESO</h3>
<div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ciencias Sociales – 1<sup>o</sup> Secundaria</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ciencias Sociales – 2<sup>o</sup> Secundaria</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ed. Para la Ciudadanía – 2<sup>o</sup> Secundaria</font></p></div>
</div>
<h3>2<sup>o</sup> ciclo ESO</h3>
<div>
<a href="cursos/3eso/ccss.html"><div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ciencias Sociales – 3<sup>o</sup> Secundaria</font></p></div></a>
<a href="cursos/3eso/cul.html"><div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Cultura Clásica – 3<sup>o</sup> y 4<sup>o</sup> Secundaria</font></p></div></a>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ciencias Sociales – 4<sup>o</sup> Secundaria</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Educación Ético-Cívica – 4<sup>o</sup> Secundaria</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Iniciativa Emprendedora – 4<sup>o</sup> Secundaria</font></p></div>
</div>
<h3>2<sup>o</sup> ciclo de ESO (Diversificación)</h3>
<div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ámbito Socio-Lingüístico – 3<sup>o</sup> Secundaria</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Ámbito Socio-Lingüístico – 4<sup>o</sup> Secundaria</font></p></div>
</div>
<h3>1<sup>o</sup> Bachillerato</h3>
<div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Historia del Mundo Contemporáneo – 1<sup>o</sup> Bachillerato</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Economía (I) – 1<sup>o</sup> Bachillerato</font></p></div></div>
<h3>2<sup>o</sup> Bachillerato</h3>
<div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Historia de España – 2<sup>o</sup> Bachillerato</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Historia del Arte – 2<sup>o</sup> Bachillerato</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Economía (II) – 2<sup>o</sup> Bachillerato</font></p></div>
<div id="caja-ccss"><p align="center"><font id="h2-ccss" style="font-size:18px">Geografía – 2<sup>o</sup> Bachillerato</font></p></div>
</div></div></td></tr></table>
</body>
</html>

Flow89 · #4 (**permalink**) 13/02/2015, 13:07

Prueba esto:

Código Javascript:

Ver original$(function() {
    $( "#cursos" ).accordion({
      collapsible: true,
      active: false,
      heightStyle: "content"
    });
  });

Espero que haga lo que esperas.

Un saludo.

diegoguerrero · #5 (**permalink**) 13/02/2015, 15:37

Perfecto. Muchas gracias.