先上演示地址：

https://www.jq22.com/demo/jQueryHdNav201710101934/

演示地址中因为效果比较多，引用的JS多，实际我们简化一下，可以先引入JQ

然后再引入另外两个JS：

<script type="text/javascript" src="js/iscroll.js"></script>
<script type="text/javascript" src="js/navbarscroll.js"></script>
<script type="text/javascript">
$(function(){
$('#wrapper03').navbarscroll();   
});
</script>

写DIV+CSS导航调用：

<div class="wrapper03" id="wrapper03">
			<div class="scroller">
				<ul class="clearfix">
				 <li class="nav-item {hmcms:if(0=='{sort:scode}')}active{/pboot:if}">
				 <a class="nav-link " href="{pboot:sitepath}/" >首页</a>
	          </li>
		 {hmcms:nav num=30 parent=0}
	              <li class="nav-item {hmcms:if('[nav:scode]'=='{sort:tcode}')}active{/pboot:if}">
	                <a class="nav-link " href="[nav:link]">[nav:name]</a>
	              </li>
	          {/hmcms:nav}	
					 
				</ul>
			</div>
			</div>

这样就可能 实现非常好用的移动端左右滑动的导航效果了。