Sidebar меню как сделать?

Как сделать sidebar меню так, как на этом сайте?
Чтобы три подпункта меню всегда были видны, а при нажатии на большой заголовок меню показывалось полностью.

Ответ

Через css предварительно скрываем все элементы, начиная с пятого .item:nth-child(+n+5) Скрываем и раскрываем все элементы, начиная от четвёртого $('.item').slice(4)
Видимо в css порядок начинается с 1, а в js с 0
$('.item').eq(0).click(function() { $(this).html() == '↓ список' ? $(this).html('↑ список') : $(this).html('↓ список'); $('.item').slice(4).slideToggle(); }); .item { list-style: none; background: #E0E4E8; padding: 2px 4px 2px 4px; cursor: pointer; } .item:hover { background: #F4F8FB; } .list { display: list-item; } #list { cursor: pointer; } .item:nth-child(+n+5) { display: none; }

• ↓ список
• item 1
• item 2
• item 3
• item 4
• item 5
• item 6