相关疑难解决方法(0)

角度4 - 滚动动画

我正在创建一个具有整页宽度/高度div的网页.向下滚动时我有两种方法.

滚动点击

//HTML
<a (click)="goToDiv('about')"></a>

//JS
    goToDiv(id) {
        let element = document.querySelector("#"+id);
        element.scrollIntoView(element);
      }
Run Code Online (Sandbox Code Playgroud)

滚动HostListener

  @HostListener("window:scroll", ['$event'])
  onWindowScroll($event: any): void {
    this.topOffSet = window.pageYOffset;
    //window.scrollTo(0, this.topOffSet+662);
  }
Run Code Online (Sandbox Code Playgroud)

1.如何添加滚动动画效果?

就像 :

$('.scroll').on('click', function(e) {
    $('html, body').animate({
        scrollTop: $(window).height()
    }, 1200);
});
Run Code Online (Sandbox Code Playgroud)

2.如何使用HostListener滚动到下一个div?

javascript css angular angular-animations

24
推荐指数
2
解决办法
2万
查看次数

标签 统计

angular ×1

angular-animations ×1

css ×1

javascript ×1