html弹出式导航鼠标滑动到一个菜单显示出子菜单

这个功能可以通过CSS和JavaScript来实现。具体步骤如下：

1. 首先，需要在HTML中创建导航菜单的结构，包括一级菜单和二级菜单。一般使用ul和li标签来实现。

2. 使用CSS设置一级菜单的样式，并将二级菜单隐藏起来。

3. 使用JavaScript给一级菜单添加鼠标移入和移出事件，当鼠标移入一级菜单时，显示对应的二级菜单；当鼠标移出一级菜单时，隐藏对应的二级菜单。

4. 使用CSS对二级菜单进行样式设置，使其呈现弹出式效果。

以下是示例代码：

HTML:

<ul class="nav">
  <li>菜单1
    <ul>
      <li>子菜单1</li>
      <li>子菜单2</li>
    </ul>
  </li>
  <li>菜单2</li>
  <li>菜单3
    <ul>
      <li>子菜单1</li>
      <li>子菜单2</li>
      <li>子菜单3</li>
    </ul>
  </li>
</ul>

CSS:

.nav > li {
  display: inline-block;
  position: relative;
}

.nav ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
}

.nav ul li {
  display: block;
}

.nav li:hover > ul {
  display: block;
}

JavaScript:

var navItems = document.querySelectorAll('.nav > li');

for (var i = 0; i < navItems.length; i++) {
  navItems[i].addEventListener('mouseenter', function() {
    this.querySelector('ul').style.display = 'block';
  });
  
  navItems[i].addEventListener('mouseleave', function() {
    this.querySelector('ul').style.display = 'none';
  });
}

注意：以上代码仅供参考，具体实现还需要根据实际需求进行调整。