Para UX, puede haber ocasiones en las que se deban abrir varias secciones a la vez en la barra lateral. Actualmente, cuando se hace clic en el encabezado de otra sección en la barra lateral, otras secciones colapsan. ¿Cómo hago para que todas las secciones se abran y cierren solo cuando hago clic en el encabezado de la sección?
Este es el código que maneja esto:
var $mejor = $toc.find("[href='" + mejor + "']").first();
if (!$best.hasClass("active")) { // .active is applied to the ToC link we're currently on, and its parent <ul>s selected by tocListSelector // .active-expanded is applied to the ToC links that are parents of this one $toc.find(".active").removeClass("active"); $toc.find(".active-parent").removeClass("active-parent"); $best.addClass("active"); $best .parents(tocListSelector) .addClass("active") .siblings(tocLinkSelector) .addClass("active-parent"); $best.siblings(tocListSelector).addClass("active"); $toc.find(tocListSelector).filter(":not(.active)").slideUp(150); $toc.find(tocListSelector).filter(".active").slideDown(150); if (window.history.replaceState) { window.history.replaceState(null, "", best); } var thisTitle = $best.data("title"); if (thisTitle !== undefined && thisTitle.length > 0) { document.title = thisTitle.replace(htmlPattern, "") + " – " + originalTitle; } else { document.title = originalTitle; } }Las 2 líneas siguientes son donde se cierra la sección previamente seleccionada.
$toc.find(".active").removeClass("active"); $toc.find(".active-parent").removeClass("active-parent");Coméntelos y cada sección recordará abierta.
EDITAR: para poder cerrar la sección cuando hace clic en ella, debe reemplazar el método .addClass por la documentación de toggleClass . De esta forma se añade la clase active si no está presente y se elimina en caso contrario.