[CSS] 크롬에서 애니매이션이 느려지는 동작을 하는 오류

어느날 크롬만 CSS애니매이션이 느리게 동작하는 현상이 나왔습니다.

 

1. 해결방법

*{scroll-behavior: smooth;}를 제거하면됩니다.

 

제거가 힘들다면 css 아래와 같이 추가하면 됩니다.

:root {
    scroll-behavior: auto;
}

 

 

 

2. 원인

부트스트랩과 에는 "*{scroll-behavior: smooth;}"가 들어 있습니다.

이상태에서 "Jquery UI"를 사용하면 애니메이션이 이상하게 동작하는 것을 볼수 있습니다.

 

원래는 "Jquery"의 에니매이션이 우선됐는데 크롬에서 언제부터인가 "smooth"가 먹혀서 이상한 동작을 하게되었습니다.

파이어폭스에서는 여전히 정상동작하는 것으로 보아 크롬 버그거나 정책이 바뀐거겠죠.

 

 

마무리

포스팅이 올라가는 시점에서는 수정되었습니다.

크롬 버그가 맞았나보네요.

수정됐다가도 가끔 또 등장하는거보면 크롬도 뭔가 좀 ㅋㅋㅋㅋㅋ

참고 : stackoverflow  - jQuery scrollTop not working in Chrome but working in Firefox Kenny Irvine 님 답변