使用方式

<link rel="stylesheet" href="/components/style/navmenu.css" type="text/css" />
<script defer src="/components/js/navmenu.js" type="text/javascript"></script>

顶栏 mode="horizontal"

<ul class="st_menu" mode="horizontal">
  <li class="st_menu_item" index="0">处理中心</li>
  <li class="st_menu_item is_disabled" index="1">消息中心</li>
  <li class="st_menu_item" index="2">交易管理</li>
  <li class="st_submenu" index="3">
    <div class="st_submenu_title">
      工作台
      <i class="stIconFont icon-xiala-down"></i>
    </div>
    <div class="st_menu_popup_wrapper">
      <ul class="st_menu_popup bottom_open">
        <li class="st_menu_item" index="3-0">选项一</li>
        <li class="st_menu_item" index="3-1">选项二</li>
        <li class="st_submenu" index="3-2">
          <div class="st_submenu_title">
            选项三
            <i class="stIconFont icon-xiala-right"></i>
          </div>
          <div class="st_menu_popup_wrapper">
            <ul class="st_menu_popup right_open">
              <li class="st_menu_item" index="3-2-0">选项一</li>
              <li class="st_menu_item" index="3-2-1">选项二</li>
              <li class="st_menu_item" index="3-2-2">选项三</li>
            </ul>
          </div>
        </li>
      </ul>
    </div>
  </li>
  <li class="st_menu_item" index="4">个人中心</li>
</ul>

侧栏 mode="vertical"

<ul class="st_menu" mode="vertical">
  <li class="st_submenu" index="0">
    <div class="st_submenu_title">
      <i class="stIconFont icon-tuiguangguanli menu_icon"></i>
      <span>导航一</span>
      <i class="stIconFont icon-xiala-down"></i>
    </div>
    <ul class="st_menu st_menu_inline">
      <li class="st_menu_item_group">
        <div class="st_menu_item_group_title">分组一</div>
        <ul>
          <li class="st_menu_item" index="0-0">选项一</li>
          <li class="st_menu_item" index="0-1">选项二</li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="st_menu_item" index="1">
    <i class="stIconFont icon-tuiguangguanli menu_icon"></i>
    导航二
  </li>
  <li class="st_menu_item is_disabled" index="2">
    <i class="stIconFont icon-tuiguangguanli menu_icon"></i>
    导航三
  </li>
  <li class="st_menu_item" index="3">
    <i class="stIconFont icon-tuiguangguanli menu_icon"></i>
    导航四
  </li>
</ul>

属性

属性	说明	类型	可选值	默认值
mode	类型	string	horizontal/vertical	-
class	是否禁用	string	is_disabled	-