Question

我有一个有多个手风琴组的Angular应用程序。它们默认是关闭的。一个部分非常大，所以当它打开时，用户需要向下滚动才能看到该部分的结尾。本节对其进行了一些计算。问题是我在该部分的顶部有一个计算按钮，所以当用户想要重新计算它时，他们必须再次滚动到顶部才能看到按钮。

当用户到达某个位置时是否有可能获取该位置，因此它会触发带有覆盖按钮的ng-if。

谢谢，布伦特

Answer 1

您可以使用JQuery .scroll（），它可能如下所示：

var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope, $document) {
      $scope.pos = {
        scrollPos:0
      };
      
      $("#outer").scroll(function() {
        $scope.pos.scrollPos = $("#outer").scrollTop().valueOf();
        $scope.$apply();
      });
    });

#outer {
  overflow: auto;
  height: 250px;
  width: 200px;
  border: solid 1px #ccc;
}

.inner {
  height: 1000px;
  position: relative;
  width: 198px;
}

.top {
  position: absolute;
  top: 0px;
}

.bottom {
  position: absolute;
  bottom: 0px;
}

.scrolled {
  position: fixed;
  top: 30px;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  {{pos.scrollPos}}<br>
  <div id="outer">
    <div class="inner">
      <div class="scrolled ng-hide" ng-show="pos.scrollPos > 50">Passed Point.</div>
      <div class="top">Top</div>
      <div class="bottom">Bottom</div>
    </div>
  </div>
</div>

Answer 2

是的，这可以通过javascript尝试阅读Mozilla上的this文章，它将帮助您实现目标，基本上它可以让您知道鼠标在客户端的位置。除此之外，如果页面上有一个特定的元素，你需要知道光标是否在里面，你可以使用Jquery and mouseenter event然后触发一些动作。

检查用户是否在页面上的某个位置

2 个答案: