wv-2503~2505-01 (인터랙션 작업 중 기록)

WV 인터랙션 작업 중 (카드 펼쳐짐)

 

크롬에서는 부드럽게 정상적으로 작동하는 반면,

 

사파리, edge 에서 버벅거림 현상 발견.

 

이유는 top, left 로 위치를 잡았기 때문.

 

 

이게 문제가 된 css. 오로지 크롬에서만 정상적으로 보임.

 

transform으로만 작업했더니 모든 브라우저에서 부드럽게 정상 작동!

이게 수정한 css. left, top값으로 움직이지 않았다.

 

반응형 사이트이기 때문에 mobile 분기에서는 아래처럼 vw 단위를 사용했다.

1023 이하부터 줄어들면서 반응형 !

 

현재 인터랙션 작업하면서 가장 까다운것이 

 

cubic-bezier 값 맞추기. 

 

이게 지금 제일 어렵다.