Vamos ver como podemos tornar a navegação standard à esquerda colapsável.
Versão simples: Escondemos todos os elementos ul de segundo nível. Depois mostramos apenas o ul que for filho do li que estiver marcado com a classe .selected.
#sideNavBox .ms-core-listMenu-verticalBox ul ul {
display: none;
}
#sideNavBox .ms-core-listMenu-verticalBox ul li.selected ul {
display: block;
}O problema. O SharePoint apenas marca o elemento actual como selecionado. Se estivermos num elemento do segundo nível, a navegação nesse ramo vai colapsar porque o elemento pai não vai estar marcado como seleccionado.
Podemos usar jQuery para corrigir este problema.
// closest() vai olhar para o próprio elemento em que está a ser aplicado, por isso temos de excluí-lo
jQuery("#sideNavBox li.selected").closest("#sideNavBox ul.root li.static:not(.selected)").addClass("selected");Pode-se usar uma classe diferente, mas ai teremos que actualizar também o CSS.
Vejamos isto em acção:
