将导航栏转换为水平滚动菜单

Question

如何将这个导航栏放入水平滚动菜单，你能帮帮我吗？我知道这是非常基本的，但请帮帮我！！

 <nav class="navbar sticky-top navbar-light navbar-custom">

  <ul id="myTab" class="nav nav-tabs">
     <li class="nav-item">
        <a href="#planning" class="nav-link active " data-toggle="tab"><i class="fa fa-bullseye"></i> PAD</a>
     </li>
     <li class="nav-item">
        <a href="#feed" class="nav-link" data-toggle="tab"><i class="fa fa-newspaper-o" aria-hidden="true"></i>
           NEWS</a>
     </li>
     <li class="nav-item">
        <a href="#Incite" class="nav-link" data-toggle="tab"><i class="fab fa-superpowers"></i>TAB1</a>
     </li>
     <li class="nav-item">
        <a href="#home" class="nav-link" data-toggle="tab"><i class="fa fa-user"></i>USER</a>
     </li>


  </ul>
  </nav>

这是控制它的脚本

<script>
  $(document).ready(function() {
     $('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
        var activeTab = $(e.target).text(); // Get the name of active tab
        var previousTab = $(e.relatedTarget).text(); // Get the name of previous tab
        $(".active-tab span").html(activeTab);
        $(".previous-tab span").html(previousTab);
     });
  });
</script>