滚动按钮跳转部分

Question

我正在尝试在角度js中创建一个按钮，可以让我像html锚点一样动态地跳转到下一个部分，但跳转跟随用户的链接。

解决方案只是我想，但我不知道

Answer 1

使用css position: fixed进行按钮样式设置，使用$anchorScroll进行滚动。

Answer 2

你也可以使用角度滚动：

DEMO

HTML

<!-- Add ref to script after angular, just before closing body tag-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-scroll/1.0.0/angular-scroll.min.js"></script>

将id添加到target，然后将du-smooth-scroll指令添加到按钮

<p><a href="#followUser" du-smooth-scroll>Scroll to {{user.name.first}}</a></p>
<p>
   ...
</p>
<p><a id="followUser">Follow {{user.name.first}}</a></p>

JS

// expose angular scroll to app
var module = angular.module('app',['duScroll']);

Answer 3

这不是我想要的，但似乎有用：

    $('.row-title').each(function(i,item){
        $(item).attr('id', 'scroll-id-'+i);
    });
var id=-1;
var scrollTop;
var tmp;
$(window).scroll(function(){
    tmp=id;
    scrollTop=$(this).scrollTop();

    $('.row-title').each(function(i,item){
        if(item.offsetTop >=scrollTop && id!=i){

            console.log(item.outerText);
            $('.scrollToDown').attr("href", '#scroll-id-'+i);
            id=i;
            return false;
        }
    });
    if ($(this).scrollTop() > 100) {
        $('.scrollToUp').fadeIn();
    } else {
        $('.scrollToUp').fadeOut();
    }
});
//Click event to scroll to top
$('.scrollToDown').click(function(){
    if(id == tmp){
        tmp++;
        $('.scrollToDown').attr("href", '#scroll-id-'+tmp);
    }

});
//Click event to scroll to top
$('#scrollUpDown .up').click(function(){
    $('html, body').animate({scrollTop : 0},800);
    return false;
});