BootStrap里有没有适合移动端的Affix组件，我想做一个类似百度百科的目录效果

如题，项目里面用了Bootstrap的Affix组件做了一个目录导航，但是在手机端的效果很差，我想做一个类似百度百科的效果，不知道有没有这种组件（效果如下图），谢谢。


另外，大概的看了看源代码:
<dl class="catalog hide" style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">
<dt class="catalog-title">词条目录</dt>
<dd class="catalog-content" id="J-catalog-content">
<ol class="catalog-list" style="transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 1ms; transform: translate(0px, 0px) translateZ(0px);">
<li class="catalog-item level1 current" data-anchor="0" data-page="0">百科名片</li>
<li class="catalog-item level1" data-anchor="1" data-page="0">形态特征</li>
<li class="catalog-item level1" data-anchor="2" data-page="1">生长习性</li>
<li class="catalog-item level1" data-anchor="3" data-page="1">地理分布</li>
<li class="catalog-item level1" data-anchor="4" data-page="1">栽培技术</li>
<li class="catalog-item level2" data-anchor="4-1" data-page="1">栽培方法</li>
<li class="catalog-item level2" data-anchor="4-2" data-page="2">田间管理</li>
<li class="catalog-item level2" data-anchor="4-3" data-page="2">病虫防治</li>
<li class="catalog-item level1" data-anchor="5" data-page="3">药用价值</li>
<li class="catalog-item level2" data-anchor="5-1" data-page="3">功效</li>
<li class="catalog-item level2" data-anchor="5-2" data-page="4">药用毒性</li>
<li class="catalog-item level1" data-anchor="6" data-page="4">化学成分</li>
<li class="catalog-item level1" data-anchor="7" data-page="4">药材鉴别</li>
<li class="catalog-item level2" data-anchor="7-1" data-page="4">形状鉴别</li>
<li class="catalog-item level2" data-anchor="7-2" data-page="5">理化鉴别</li>
<li class="catalog-item level2" data-anchor="7-3" data-page="5">含量测定</li>
<li class="catalog-item level2" data-anchor="7-4" data-page="5">优劣辨别</li>
</ol>
</dd>
</dl>
貌似使用起来也不难，就是自己写一个，水平就不行了。