angular 返回顶部
angular 返回顶部
卞龙亭 发表于2年前
angular 返回顶部
  • 发表于 2年前
  • 阅读 30
  • 收藏 0
  • 点赞 0
  • 评论 0

标题:腾讯云 新注册用户域名抢购1元起>>>   

摘要: 使用angular的指令写一个简单的返回顶部的功能

html代码

<button go-top>TOP</button>

实现的指令

.directive('goTop',['$interval',function($interval){  //返回顶部
    return {
        restrict : 'A',
        link : function(scope,element,attr){
            element.on("click",function(){
                var timer = $interval(function(){
                    var osTop = document.documentElement.scrollTop || document.body.scrollTop;
                    document.documentElement.scrollTop = document.body.scrollTop =o sTop -1 00;
                    if ( osTop == 0 ) {
                        $interval.cancel(timer);
                    };
                },10)
            })
        }
    }
}])

 

共有 人打赏支持
粉丝 0
博文 11
码字总数 3842
×
卞龙亭
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: