如果指定了絕對位置和溢出-x隱藏位置，則無法滾動到元素

Question

我給ng-view設置了動畫。 我使用的是Slideup動畫，它需要元素的絕對位置，並且還需要overflow-x: hidden以剪輯內容。 在一個子頁面中，我必須使用scrollTo元素功能，但是如果同時指定了兩個值，則該功能不起作用。 這是主要的ng-view類，可用於正確的動畫

.wrapper {
    position: absolute !important; 
    left: 0;
    top: 0;
    height: 100%;
    min-height: 100%;
    min-width: 100%;
    overflow-x: hidden;
  }

和結構：

<div class="wrapper ng-view-div">
 <nav>
        <ul>
          <li><a href du-smooth-scroll="section-1" du-scrollspy>Section 1</a></li>
            <li><a href du-smooth-scroll="section-2" du-scrollspy>Section 2</a></li>
            <li><a href du-smooth-scroll="section-3" du-scrollspy>Section 3</a></li>
        </ul>
    </nav>

<section id="section-1" style="background-color: red">
  C
</section>
<section id="section-2"  style="background-color: blue">
  C
</section>
<section id="section-3"  style="background-color: green">
  C
</section>
</div>

我准備了plnkr來輕松展示它的外觀。 除了這兩個值，還有其他方法可以實現滾動工作嗎？

Answer 1

在這里，包裝CSS類中的height：100％造成了問題。 請使用下面的包裝CSS類。

.wrapper {
    position: absolute !important; 
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    overflow-x: hidden;
}