移动端返回顶部

当页面滚动某个地方,就显示返回顶部图标,否则隐藏

点击可以返回顶部

实现代码跟pc端一致

案例分析:

  1. 滚动某个地方显示

  2. 事件:scroll页面滚动事件 

  3. 如果被卷去的头部(window.pageYOffset )大于某个数值

  4. 点击,window.scroll(0,0) 返回顶部

//返回顶部模块制作
var goBack = document.querySelector( '.goBack' );
var nav = document.querySelector( 'nav');
window.addEventListener( 'scrol1', function() {
if (window.pageYoffset >= nav.offsetTop) {
goBack.style.display = 'block' ;
} else {
goBack.style.display = 'none';
}
});
goBack.addEventListener( 'click', function() {
window. scro11(0, 0);
})

 

posted @ 2020-10-02 22:32  星辰ꦿ.大海  阅读(253)  评论(0编辑  收藏  举报