这是我目前的指令,我发现这是以下问题的第二个答案 - ScrollTo function in AngularJS:
.directive('scrollToItem', function($timeout) {
return {
restrict: 'A',
scope: {
scrollTo: "@"
},
link: function(scope, $elm,attr) {
$elm.on('click', function() {
$('html,body').animate({scrollTop: $(scope.scrollTo).offset().top }, "slow");
});
}
}})
上面的代码可以这样使用:
<a id="top-scroll" name="top"></a>
<div class="back-to-top" scroll-to-item scroll-to="#top-scroll">
问题在于,这会导致页面快速向上滚动,然后从顶部进行动画处理。我是否建议您从当前位置滚动到所需位置?
答案 0 :(得分:0)
一种解决方案是改变
$elm.on('click', function() {
$('html,body').animate({scrollTop: $(scope.scrollTo).offset().top }, "slow");
});
到
$elm.on('click', function(e) {
e.preventDefault();
$('html,body').animate({scrollTop: $(scope.scrollTo).offset().top }, "slow");
});
我在这里找到:jQuery flicker when using animate-scrollTo
我会等,看看是否有更好的解决方案。如果没有,我会把这个标记为正确的解决方案。