我正在创建一个具有整页宽度/高度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?