停止子下拉页面几秒钟

Question

我已经制作了多个下拉列表，我想停止页面的子下拉几秒钟。有没有办法在css中停止该页面或使用javascript这里是代码

<div class="dropdown">
  <a id="dLabel" role="button" data-toggle="dropdown" class="btn btn-default" data-target="#" style=" padding-top: 3px; padding-bottom: 3px;"> Action 
    <span class="caret">
    </span>
  </a>
  <ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
    <li>
      <a href="index.php?index_edit_id=<?php echo $c_id;?>">
        <button class="btn btn-default btn-sm remove" >
          <i class="fa fa-pencil-square-o fa-lg" aria-hidden='true' style=" font-weight:10px;"> Edit-Update
          </i>
        </button>
      </a>
    </li>
    <div class="divider">
    </div>
    <li class="dropdown-submenu parent">
      <a href="#">
        <i class="fa fa-hand-o-left" aria-hidden="true"style="padding-left:10px;">Edit-File
        </i>
      </a>
      <ul class="dropdown-menu submenu">
        Here is code of form 
      </ul>
    </li>
  </ul>
</div> 

我想在此处停止下拉菜单子菜单列表页面已打开。<ul class="dropdown-menu submenu"> Here is code of form </ul>当我点击并打开下拉菜单子菜单时，我希望该子下拉菜单子菜单页停止几秒钟。这是css的代码

    .dropdown-submenu {
        position: relative;
    }
    .dropdown-submenu>.dropdown-menu {
        top: 0;
        right: 100%;
        margin-top: -210px;
        margin-left: -150px;
        -webkit-border-radius: 0 6px 6px 6px;
        -moz-border-radius: 0 6px 6px;
        border-radius: 0 6px 6px 6px;
    }
    .dropdown-submenu:hover>.dropdown-menu {
       display: block;
    }
    .dropdown-submenu>a:after {
        display: block;
        content: " ";
        float:left;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #ccc;
        margin-top: 5px;
        margin-right: -10px;
    }
    .dropdown-submenu:hover>a:after {
       border-left-color: #fff;
    }
    .multi-level
    {
       position:justify;
       right:100%;
       margin-left:-60px;   
    }

请帮助我，某人。我会感谢完整的