Me encuentro utilizando el "accordion" de Bootstrap. Lo he combinado con enlaces de navegación jerarquizados por medio de IDs y me gustaría que el acordeón se abriera con base en la URL actual.
Tengo actualmente mi código en JS, pero sólo se expande cuando se ha visitado previamente un item perteneciente a la misma categoría.
Muestro el código que tengo actualmente.
HTML:
Código HTML:
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#accordion" href="#unidad1">
<strong>Unidad 1: ...</strong>
</a>
</div>
<div id="unidad1" class="panel-collapse collapse">
<div class="panel-body">
<nav class="">
<ul>
<li><a href="">item</a></li>
<li><a href="">item</a></li>
...
</ul>
</nav>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#accordion" href="#unidad2">
<strong>Unidad 2: ...</strong>
</a>
</div>
<div id="unidad2" class="panel-collapse collapse">
<div class="panel-body">
<nav>
<ul>
<li><a href="">item</a></li>
<li><a href="">item</a></li>
...
</ul>
</nav>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#accordion" href="#unidad3">
<strong>Unidad 3: ...</strong>
</a>
</div>
<div id="unidad3" class="panel-collapse collapse">
<div class="panel-body">
<nav>
<ul>
<li><a href="">item</a></li>
<li><a href="">item</a></li>
...
</ul>
</nav>
</div>
</div>
</div>
</div> JavaScript
:
Código HTML:
<script type="text/javascript">
$(document).ready(function () {
var last = $.cookie('activeAccordionGroup');
if (last != null) {
$("#accordion .collapse").removeClass('in');
$("#" + last).addClass("in");
}
});
$("#accordion").on('hidden.bs.collapse', function () {
$.removeCookie('activeAccordionGroup');
});
$("#accordion").on('shown.bs.collapse', function () {
var active = $("#accordion .in").attr('id');
$.cookie('activeAccordionGroup', active);
});
</script> Dejo el ejemplo ya aplicado en el siguiente sitio:
http://disenowebakus.net/diseno-de-un-sitio-web.php
La intención es que el usuario cuando ingrese por primera vez a una URL el acordeón se abra dependiendo la unidad en la que se encuentre, en el ejemplo anterior, se tendría que abrir "Unidad 2: Gestión del Sitio".
Muchas gracias por su atención y ayuda. Saludos!