如何在不损坏片段的情况下创建下拉菜单答案

【问题标题】：how to create a dropdown menu without damaging a snippet如何在不损坏片段的情况下创建下拉菜单
【发布时间】：2016-05-31 18:24:13
【问题描述】：

https://github.com/nedzone/uht-yniversitet你好，你可以在这里查看我的代码，我想问你能不能帮我制作一个下拉菜单

<div class="boxwhitetop"> <!-- бяла част на менюто -->
    <ul class="snip1488"> <!-- меню горна лента -->
      <li class="current"><a href="#">Начало</a></li>
      <li>
        <a href="#">Факултети</a>
        <ul>
          <a href="#">1</a>
          <a href="#">2</a>
          <a href="#">3</a>
        </ul>
      </li>
      <li><a href="#">Ръководство</a></li>
      <li><a href="#">Спортен комплекс</a></li>
      <li><a href="#">Новини</a></li>
      <li><a href="#">Разсписи</a></li>
    </ul>

【问题讨论】：

“如何”不是关于 SO 的正确问题...请告诉我们您尝试了什么以及出了什么问题。
我尝试使用 css 下拉菜单它不起作用它看起来很丑因为 sn-p 我不想刹车 sn-p 只是为了将下拉菜单添加到单个 UL 按钮

标签： jquery html css drop-down-menu

【解决方案1】：

有很多方法可以做到这一点......根据您的代码，这是一个简单的方法：

HTML

<div class="boxwhitetop"> <!-- бяла част на менюто -->

<!-- button to open/close the menu  --> 
<button class ="menu" >Menu</button>

<ul class="snip1488"> <!-- меню горна лента -->
  <li class="current"><a href="#">Начало</a></li>
    <li>
      <a href="#">Факултети</a>
      <ul>
        <a href="#">1</a>
        <a href="#">2</a>
        <a href="#">3</a>
      </ul>
    </li>
    <li><a href="#">Ръководство</a></li>
    <li><a href="#">Спортен комплекс</a></li>
    <li><a href="#">Новини</a></li>
    <li><a href="#">Разсписи</a></li>
  </ul>

JS 脚本

$(".menu").Click(function(){

      $(this).siblings(".snip1488").slideToggle(300);

 });

希望对你有用

【讨论】：

它没用.. 它没有帮助我。不会改变我身上的代码..你能更准确吗:)
@NedkoBoqnov 这是完整的代码检查它，它必须工作github.com/BlacKnight-RH/stackOverFlow/commit/…

【解决方案2】：

如果您想要一个带有下拉菜单的水平菜单，您可以只使用 CSS 来实现。您应该将列表项设为display: inline-block，然后在悬停时使用display: block/none 切换子菜单。像这样：http://codepen.io/anon/pen/OXPPyB

【讨论】：