Как создать вертикальный скользящий список ссылок с помощью jquery?

Question

на веб-сайте jQueryUI по следующему адресу приведен пример стилизации кнопки со стрелкой вниз, которая может открыть меню (возможно, лучше взглянуть на URL, чтобы убедиться, чтопонимаю ...: O).

давайте предположим, что будет иметь следующую разметку:

<div id="buttonMenu" style="display: none;">
   <ul>
      <li><a href="#1">Menu Item 1</a></li>
      <li><a href="#2">Menu Item 2</a></li>
      <li><a href="#3">Menu Item 3</a></li>
      <li><a href="#4">Menu Item 4</a></li>
   </ul>
</div>

Может кто-нибудь сказать мне, как я могу показать div как меню, когда пользователь нажимает на этоarrow?

Заранее спасибо за помощь!

Answer 1

Наиболее общим решением было бы обернуть кнопку разделения в контейнере без отступов или полей, установить position: relative на контейнере, а затем использовать что-то вроде этого, чтобы определить, где будет появляться меню при использовании .show():

position: absolute;
left: 0;
top: <height of the split button>;

Однако более простым решением было бы найти плагин контекстного меню, который позволяет вручную запускать и настраивать обработчик щелчков, который динамически извлекает положение нижнего левого угла кнопки разделения и запускает там плагин контекстного меню. Таким образом, вам не нужно заново изобретать такие вещи, как повторное скрытие меню, если пользователь щелкает где-то за его пределами.