文章关键字 ‘scroll-snap-align’

CSS ::scroll-button ::scroll-marker伪元素又是干嘛用的?

2025年06月13日,星期五

scroll snap 按钮自定义封面图

CSS越来越强了,Scroll Snap交互又新增了按钮和切换按钮的生成与自定义,类似Carousel ,Slider这类经典交互纯CSS就能完全驾驭了。

阅读全文…

纯CSS实现微信列表左滑显示按钮的交互效果

2020年12月13日,星期日

可爱猫咪占位图

本文内容可谓是大开眼界,纯CSS实现自动边缘定位、带视差滚动的,iOS微信列表左滑显示按钮的交互效果,CSS可以做的远比你想象的更多。

阅读全文…

CSS scroll-snap滚动事件停止及元素位置检测

2019年04月20日,星期六

scroll snap头图

CSS Scroll Snap是个非常好用的特性,可以让滚动停止的时候,无需任何JS代码,自动平滑定位到指定元素的指定位置。但实际开发的时候,发现很多场景还需要知道滚动什么时候停止,以及到底滚动到哪个元素上,浏览器目前还没有原生的方法支持,需要我们使用JS进行辅助处理……

阅读全文…

大侠,请留步,要不过来了解下CSS Scroll Snap?

2018年11月28日,星期三

scroll snap头图

CSS Scroll Snap是CSS中一个独立的模块,可以让网页容器滚动停止的时候,自动平滑定位到指定元素的指定位置。虽然Scroll Snap最后的定位效果是平滑的,但是Scroll Snap的作用不是平滑滚动,而是元素定位增强。要想实现平滑滚动,请使用CSS scroll-behavior属性

阅读全文…