jq 上下滑动菜单

可以使用 jQuery 的 `slideUp()` 和 `slideDown()` 方法来实现上下滑动菜单的效果。以下是一个简单的示例代码：

HTML 代码：

<div class="menu">
  <a href="#">菜单1</a>
  <a href="#">菜单2</a>
  <a href="#">菜单3</a>
  <a href="#">菜单4</a>
  <a href="#">菜单5</a>
</div>

CSS 代码：

.menu a {
  display: block;
  padding: 10px;
  border-bottom: 1px solid #ccc;
  text-decoration: none;
  color: #333;
}
.menu a:last-child {
  border-bottom: none;
}
.submenu {
  display: none;
  background-color: #f2f2f2;
  padding: 10px;
}

JavaScript 代码：

$(document).ready(function() {
  $('.menu a').click(function() {
    var $submenu = $(this).next('.submenu');
    if ($submenu.is(':visible')) {
      $submenu.slideUp();
    } else {
      $('.submenu').slideUp();
      $submenu.slideDown();
    }
    return false;
  });
});

这段代码的作用是当用户点击菜单项时，显示或隐藏与之关联的下拉菜单。如果下拉菜单已经显示，则隐藏它；否则，先隐藏所有下拉菜单，再显示当前菜单项对应的下拉菜单。