Вертикальное вторичное указывающее меню в семантическом интерфейсе: как привязать к разделу h2?

Я портирую старый код в семантический интерфейс, что неплохо. Я пытаюсь воспроизвести поведение вертикального бокового меню, которое они использовали во всех своих документах (вертикальное вторичное указывающее меню). См., Например, левое меню («Типы», «Группы» и т. Д.) На этой странице:

http://semantic-ui.com/elements/button.html

Щелчок по пункту меню вызывает прокрутку страницы к названному разделу, и я не могу воспроизвести такое поведение. Я не вижу href в записях. Вероятно, есть что-то, что превосходит мои (очень классические) знания HTML / Javascript. Я хотел бы, чтобы такой простой пример работал таким же образом (класс 'peek' в основном прикрепляет меню слева):

<body>      
  <div class="peek">
    <div class="ui vertical pointing secondary menu">
      <a class="item active">Part 1</a>
      <a class="item">Part2</a>
    </div>
  </div>

  <h2 class="ui dividing header">Part 1</h2>

  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec 
  odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. 
  Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede 
  (etc. put a long enough text here for scrolling).</p>

  <h2 class="ui dividing header">Part 2</h2>

  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec 
  odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. 
  Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>

  </div>
</body>

Это не сработает, если я просто включу semantic.min.js и semantic.css в свой заголовок. Итак, я понимаю, что в этом случае поведение по умолчанию не предопределено. Будет ли какая-нибудь добрая душа достаточно любезна, чтобы помочь мне с требуемым CSS / Javascript в семантическом пользовательском интерфейсе?

Спасибо заранее,

Ивонник


menu scroll semantic-ui
person Yvonnick Noel    schedule 06.02.2014    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я также пытался использовать то же самое, но, поскольку его нет в документации, я просто предположил, что он не включен в Semantic и является настраиваемым классом.

Я оставил это меню в другом столбце, а затем

.peek{
  position:fixed;
}
person Sebastialonso    schedule 17.02.2014