javascript - AngularJS - $anchorScroll 平滑/持续时间

标签 javascript angularjs scroll anchor-scroll

阅读AngularJS docs我还没有弄清楚 $anchorScroll 是否可以有持续时间/缓动选项来平滑滚动到元素。

它只是说:

$location.hash('bottom');

// call $anchorScroll()
$anchorScroll();

我不使用 jquery,也不想;是否仍然有一种聪明而简单的方法来制作或扩展 $anchorScroll 以使滚动更流畅?

最佳答案

不幸的是,使用 $anchorScroll 是不可能的。正如您所发现的那样,$anchorScroll 没有任何选项并且不能与 $ngAnimate 一起使用。为了使滚动动画,您需要使用自己的服务/工厂或直接使用 javascript。

为了自学,我整理了一个带有平滑滚动服务的示例。可能有更好的方法来做到这一点,因此鼓励任何反馈。

要滚动到一个元素,您可以将 ng-click="gotoElement(ID)" 附加到任何元素。我认为更好的方法是将其设为指令。

这是 working example on jsFiddle .

更新

现在有许多第三方指令可以实现这一点。

关于javascript - AngularJS - $anchorScroll 平滑/持续时间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21749878/

相关文章:

javascript - 如何在跟踪浏览器窗口高度的网页上创建滚动区域?

javascript - jquery - 如何使窗口区域滚动和 iframe 也同时滚动?

javascript - 无法将值从 Javascript 文件发送到 Android Activity

javascript - chop 前 120 个字符后的所有内容并刷新

angularjs - 通过单击复选框使用指令更改输入类型

c# - 如何使 PictureBox 可滚动

javascript - 使用 Javascript 检查输入表单中的字符和字符顺序,以显示与字符和字符顺序匹配的图像

javascript - ckeditor + setData = 额外段落

javascript - Angular 模态窗口(UI-路由器/指令)

angularjs - Angular $compile 不工作