Rob*_*ian 1 javascript css css3 twitter-bootstrap angularjs
问什么是最好的方式"滚动更多还是我们到达Angular中可滚动区域的底部?"
拥有一个带有固定底部导航栏的单页应用程序,并希望显示一个指示有更多内容要显示的ui cue,条件是不在页面末尾.认为有一个书签方式(哈希标签)来做到这一点.
这是一种解决方案:我创建了绑定滚动事件的指令,如果可以向下滚动,则显示div,在编译时附加:
app.directive('thereIsMore', function() {
return {
restrict: 'A',
scope: true,
compile: function(tElement) {
tElement.append('<div class="there-is-more" ng-show="bottom">There is more...</div>');
return function(scope, element) {
var elm = element[0];
var check = function() {
scope.bottom = !(elm.offsetHeight + elm.scrollTop >= elm.scrollHeight);
};
element.bind('scroll', function() {
scope.$apply(check);
});
check();
}; // end of link
}
};
});
Run Code Online (Sandbox Code Playgroud)
工作示例:http://plnkr.co/edit/8W3E7BunpDxIkEPDqxzb?p = preview
| 归档时间: |
|
| 查看次数: |
5776 次 |
| 最近记录: |