ui-view 滚动偏移问题

Question

我的 ui-sref 元素出现滚动问题。

index.html 看起来像这样：

<header>
<div id="header" class="flat-menu single-menu" ng-include="'partials/header-hr.html'"></div>
</header>
<div ui-view></div>
<footer id="footer" data-ng-include="'partials/footer-hr.html'"></footer>

下拉列表的标题部分：

<ul class="dropdown-menu">
<li><a ui-sref="about({ '#': 'a' })"">a</a></li>
<li><a ui-sref="about({ '#': 'b' })"">b</a></li>
<li><a ui-sref="about({ '#': 'c' })"">c</a></li>
<li><a ui-sref="about({ '#': 'd' })"">d</a></li>
<li><a ui-sref="about({ '#': 'e' })"">e</a></li>
</ul>

因此，滚动到特定的 ui-sref 是可行的，但它将视图定位到页面顶部（在标题后面），您无法看到前几行。

有什么办法可以让 uiviewscroll 偏移，让 sref 从标题下方开始？

附：这是我在这里的第一篇文章，如果我未能提供所需的全部上下文，请原谅我:)

Answer 1

我认为您的标题与您的内容重叠，对。

你需要做的是。

在你的标题中添加这个 CSS 属性：

位置：相对；

或

这是另一种解决方案 - 在标题 div 之外使用 ui-sref，如下所示：

<header>
   <div id="header" class="flat-menu single-menu" ng-include="'partials/header-hr.html'"></div>
   <ul class="dropdown-menu">
       <li><a ui-sref="about({ '#': 'a' })"">a</a></li>
       <li><a ui-sref="about({ '#': 'b' })"">b</a></li>
       <li><a ui-sref="about({ '#': 'c' })"">c</a></li>
       <li><a ui-sref="about({ '#': 'd' })"">d</a></li>
       <li><a ui-sref="about({ '#': 'e' })"">e</a></li>
   </ul>
</header>
<div ui-view></div>
<footer id="footer" data-ng-include="'partials/footer-hr.html'"></footer>