滑动切换嵌套有序列表答案

【问题标题】：Slide Toggle nested ordered list滑动切换嵌套有序列表
【发布时间】：2012-04-03 07:00:52
【问题描述】：

我一直在尝试创建一个垂直菜单，每次按下主列表项时都会显示/隐藏子项（嵌套在另一个有序列表中）。我遇到了两个问题：

适用于 JSFiddle，但不适用于我的本地文件夹。 - 文件 Jquery.js 放在文件夹“js”和 src="js/Jquery.js"*
第二个菜单“标题”的滑动切换行为与第一个“标题”不太一样。它更像是一个切换而不是一个 slideToggle - 这是为什么呢？

<ol class="main_menu">
   <li class="main_item">
      <a href="#">Profile</a>
   </li>
   <ol>
      <li class="sub_item"><a href="#">details</a></li>
      <li class="sub_item"><a href="#">uploaded CV</a></li>
   </ol>

   <li class="main_item_last"><a href="#">Applied Jobs</a></li>
   <ol>        
      <li class="sub_item"><a href="#">In-progress</a></li>    
      <li class="sub_item"><a href="#">Completed</a></li>    
   </ol>
</ol>

【问题讨论】：

我怀疑ol 是ol 的有效子元素。您确定您的文档类型中允许这样做吗？
我不完全确定。基本上，我重用了一些用于无序列表的 jQuery 代码，并对其进行了调整。有没有更好的方法来模仿上述行为？
我给你看一个演示，让我修复你的 CSS - HTML

标签： jquery html css

【解决方案1】：

只需将其添加到您的 CSS 上即可进行修复。见here

ol li {
 overflow:hidden;   
}

【讨论】：