ios 스크롤 바운스

다음과 같이 아이폰에서 흔들리는 현상을 ios 스크롤 바운스라고 한다.

 

해결방법

해결방법으로는 다음 css 를 적용시켜주는 것이다.

그리고 스크롤 되지 않길 원하는 부분을 .wrap css 로 감싸준다.

html,
body {
  position: fixed;

  overflow: hidden;
}

.wrap {
  width: 100vw;

  height: 100vh;

  overflow-y: scroll;

  -webkit-overflow-scrolling: touch;
}

 

다음 코드 처럼말이다.

import Board from "./Board";
import "./App.css";
function App() {
  return (
    <div className="wrap">
      <Board></Board>
    </div>
  );
}

export default App;

참고자료

https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=aramjo&logNo=221237982842 

iOS 사파리 overscroll/bounce 막기