javascript - 移动网站的滚动助手

Question

我有一个很长的文章页面，我想帮助移动用户滚动。对于移动应用程序中很长的列表，通常有一个字母索引，可以帮助用户跳转到列表中的各个位置。如何为网络应用程序实现类似的功能？

如果它有帮助，我的堆栈是 angularjs/jquery/PhoneGap。

Answer 1

只需使用 Angular 的内置 $anchorScroll 服务即可。

请参阅live example in angular's official docs 。以下是重要的代码片段:

在您的 View 模板中:

<div id="scrollArea" ng-controller="ScrollCtrl">
  <a ng-click="gotoBottom()">Go to bottom</a>
  <a id="bottom"></a> You're at the bottom!
</div>

在你的 Controller 中:

function ScrollCtrl($scope, $location, $anchorScroll) {
  $scope.gotoBottom = function (){
    // set the location.hash to the id of
    // the element you wish to scroll to.
    $location.hash('bottom');

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