SEARCH

夸米动态

纯css锚点跳转过渡效果,告别JS,小白1分钟就会

2020-03-24 04:53:30

我们在浏览网站时,经常会看到返回顶部和楼层跳转的效果,但是这些大部分都是通过js来实现的。那么不用js也可以实现吗?答案是可以的。 

当当当当!

只需要给body,html写了一个scroll-behavior: smooth,只要有这个属性,就会使得锚点跳转有过渡效果。

可以说对于不懂js的小伙伴来说,这个属性简直就是好用到爆,而且过渡的流畅度还挺好的。


下面我们来了解下scroll-behavior:
 
语法:scroll-behavior有两个属性值,默认auto
 
auto:滚动框立即滚动
 
smooth:实现平稳的滚动
 
用法:哪个容器需要滚动就在那里加上scroll-behaviorr: smooth(简单粗暴的理解 - -!)


 

丨夸米科技

咨询直线:186-2370-8562  官方网站:www.quamae.com

 

*请认真填写需求信息,我们会在24小时内与您取得联系。

LOGO

地址

重庆市渝北区金开大道西段106号创新科技园区3座4楼

郑州市中原区电厂西路西三环交叉口大学科技园东区15E

联系

400-966-3016
[email protected]
重庆夸米网络科技有限公司 版权所有 备案号:渝ICP备16002041号-2 站点已申请专利保护 盗版必究 法律支持:河南律师服务中心
多一份参考,总有益处
联系夸米,免费获得《策划方案》及报价
高端网站建设 | 响应式网站 | 企业官网 | 营销网站 | UI设计 | 小程序开发 | APP开发 | 品牌设计 | 网络营销推广
业务热线:400-966-3016
QQ咨询
稍后再说