Question

我使用dropit.js创建了一个下拉菜单，效果很好。我尝试将其复制到我的帐户设置菜单中，但似乎没有使用CSS。

这是我的HTML：

   <ul id="top-nav" class="settings menu">
     <li><img src="twitter/idiot/128.jpg" alt="avatar"></li>

     <li><a href="https://s3.amazonaws.com/uifaces/faces/twitter/idiot/128.jpg">Sam Yanow I</a></li>
      <ul>
              <li><a href="#"><i class="fa fa-gear"></i> Account Settings</a></li>
              <li><a href="#"><i class="fa fa-group"></i> Collaborators</a></li>
              <li><a href="#"><i class="fa fa-plus-circle"></i>Upgrade</a></li>

          </ul>

     <li class="btn-outline"><a href="signup.html">Sign Up</a></li>
   </ul>

这是底部关联的JS：

<script type="text/javascript"> $(".menu").dropit();

A link to dropit.css

A link to the dropit.js

Answer 1

你关闭了LI，然后在UL中添加了应该是LI的孩子作为LI的兄弟。

孩子UL应该在LI内。

<强> Demo

 <li><a href="https://s3.amazonaws.com/uifaces/faces/twitter/idiot/128.jpg">
        Sam Yanow I
     </a><!-- remove this </li> -->
     <ul>
          <li><a href="#"><i class="fa fa-gear"></i> Account Settings</a></li>
          <li><a href="#"><i class="fa fa-group"></i> Collaborators</a></li>
          <li><a href="#"><i class="fa fa-plus-circle"></i>Upgrade</a></li>

     </ul>
</li><!--  it belongs here -->

使用dropit.js的下拉菜单

1 个答案: