javascript - 选项卡面板可在移动 View 中滑动吗？

Question

我有一个选项卡式菜单，并且我希望选项卡式菜单(ul class="tabs")能够在移动 View 中滑动。

编辑:我发现了一个关于使用Slick JS的片段，我从来不知道这个JS，但我希望它应用这个codepen在我当前的选项卡式菜单上。

如何与我当前的选项卡式菜单正确结合？我尝试将其组合起来，但选项卡式菜单的当前 UI 设计变得困惑。

这是我的 codepen选项卡式菜单

<section class="wrapper">
<ul class="tabs">
   <li class="active"><span class="icons-tabbed icon-icon-tab-locator">Tab 1</span></li>
   <li><span  id="partner-store" class="icons-tabbed icon-icon-tab-howto">Tab 2</span></li>
   <li><span  id="partner-store" class="icons-tabbed icon-icon-tab-howto">Tab 3</span></li>
</ul>
<ul class="tab__content">
   <li class="active">
      <div id="tab1" class="content__wrapper">
      </div>
   </li>

Answer 1

如果您只想在菜单上水平滑动，以显示视口(viewport)中不可见的任何其他导航项，则可以使用 css 来实现。

@media screen and (max-width: 768px) {
  .tabs {
    overflow-x: scroll;
    white-space: nowrap;
  }
}