CSS scroll-snap-stop 속성

정의와 사용법

터치패드나 터치스크린에서 빠르게 슬라이딩할 때,scroll-snap-stop 속성은 스크롤이 요소를 건너뜁니다还是会停止并吸附到下一个元素进行指定。

스크롤 애니메이션 멈춤 행동을 제어하려면, 자식 요소에 속성을 설정해야 합니다. scroll-snap-stop 또는 이전 페이지 속성, 그리고 부모 요소에도 설정: scroll-snap-type 속성.

주의: 터치패드나 터치스크린 장치에서 스와이프手势를 사용해야 해당 속성을 경험할 수 있습니다. scroll-snap-stop 속성의 효과.

터치패드나 터치스크린에서 빠르게 슬라이딩할 때, 강제로 스크롤을 멈추고 다음 요소에 끌리게 하며, 요소를 건너뜁니다:

div {
  scroll-snap-stop: always;
}

scroll-snap-stop: normal|always|initial|inherit;

값	설명
normal	기본 값. 터치패드나 터치스크린에서 빠르게 슬라이딩한 후, 스크롤이 느리게 감속하여 여러 요소를 건너뜁니다.
always	터치패드나 터치스크린에서 빠르게 슬라이딩한 후, 스크롤이 멈추고 다음 요소가 초점 위치에 끌립니다.
initial	이 속성을 기본 값으로 설정합니다. 참고: initial。
inherit	이 속성은 부모 요소에서 상속됩니다. 참고: inherit。

기본값:	normal
상속성:	아니요
애니메이션 제작:	지원하지 않습니다. 참고:애니메이션 관련 속성。
버전:	CSS3
JavaScript 문법:	object.style.scrollSnapStop="always"

표格에 나타난 숫자는 이 속성을 최초로 완전히 지원하는 브라우저 버전을 나타냅니다.

크롬	에지	파이어폭스	사파리	오페라
75.0	79.0	103.0	15.0	15.0