首页 > 解决方案 > 选项卡和独立滚动位置

问题描述

我目前在我的项目中使用https://materializecss.com/tabs.html库。

不幸的是,我有一个小问题导致了一些问题。

我有 4 个选项卡,所有这些选项卡都充满了内容,现在当我向下滚动到选项卡 1 的内容底部,然后单击转到选项卡 2 时,滚动位置与选项卡 1 一样位于底部。

我的理解是选项卡会有自己的滚动位置,并且在切换选项卡时会记住它们的状态。

我有点茫然,除非我在每个选项卡内添加一个固定位置的 div,否则在这里尝试什么?

 <div class="row">
   <div class="col s12">
    <ul class="tabs">
      <li class="tab col s3"><a href="#test1">Test 1</a></li>
      <li class="tab col s3"><a class="active" href="#test2">Test 2</a></li>
      <li class="tab col s3"><a href="#test3">Disabled Tab</a></li>
      <li class="tab col s3"><a href="#test4">Test 4</a></li>
    </ul>
  </div>
  <div id="test1" class="col s12">Test 1</div>
  <div id="test2" class="col s12">Test 2</div>
  <div id="test3" class="col s12">Test 3</div>
  <div id="test4" class="col s12">Test 4</div>
 </div>

每个选项卡都有自己的滚动位置

标签: jquerycssscrolltabsmaterialize

解决方案


推荐阅读