# 使用css一行代码或JS实现元素的平滑置顶
# 快速导航
# 前言
在很多网站当中,都有置顶的功能,很多同学首先想到的就是使用Js
去实现,其实,用简单的css也是可以搞定的
# CSS实现
在html
,body
或滚动元素内容
html,body {
scroll-behavior:smooth;
}
1
2
3
4
2
3
4
或使用js
元素.onclick = function() {
window.scrollTo({
top: 0,
behavior:"smooth" // smooth,平滑滚动,instant,瞬间
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 注意事项
在Vue
项目里,不要使用window.scrollTop
,在Vue
项目里,会显示window.scrollTop is not function
,原生应用里可以使用