Question

我的项目基于Angular Material构建，Angular JS和我使用ngSticky在主标题下面粘贴标题（这是一个md工具栏）。

在第二个标题（粘性）中，有一堆按钮，可以作为滚动到同一页面中不同部分的链接。（单击按钮时，页面应滚动到相应的部分。）

我使用了以下代码

角度控制器

$anchorScroll.yOffset = 100;  
$location.hash(anchor);
$anchorScroll();

HTML

<div sticky offset="65" media-query="min-width: 1000px" style="background-color:white; border-bottom: 1px solid #CFCFCF;">
    <ng-include src="'XXX/XXX-buttons.html'"></ng-include>
    <div class="space-top-bottom"></div>
    <ng-include src="'XXX/XXX-links.html'"></ng-include>
</div>

请注意，这些链接位于'<ng-include src="'XXX/XXX-links.html'"></ng-include>'

下

目前，页面滚动但不是正确的位置，它忽略了粘性标题高度。

根据Angular JS dos，“为了使yOffset正常工作，应该在文档的根目录上进行滚动，而不是某些子元素。”

预期行为：页面应滚动到精确的div id。

问题：

无法向滚动添加添加偏移量以补偿标题（粘性）高度。

非常感谢帮助。

Answer 1

我找到了以下解决方案，

$location.hash('current-div');
$anchorScroll();
$('#scrolling-div').animate({ scrollTop: $('#current-div').position().top - $('#sticky-div').height() }, "slow");

这个想法是在div上设置动画，而不是父div。

希望这有助于某人。

Angularjs $ anchorScroll.yOffset不适用于ng-sticky标头

1 个答案: