pull to refresh를 막아봅시다

모바일 환경에서 게임을 플레이 하다 보면 스크롤을 아래로 쭉 당기게 되어 사용자 본인도 모르게 페이지가 새로고침이 되는 경우가 있다. 실제로 토너먼트 서비스에서 게임을 플레이 하다 새로고침을 하게 되어 게임을 끝마치치 못해 기록이 날아가는 경우 관련하여 유저 피드백이 있어 이걸 어떻게 처리해야될지 고민을 하게 됐다.
관련하여 어떤 방법이 있는지 찾아보니 생각보다 해결 방법이 간단했다. 바로 overscroll-behavoircontain 혹은 none 을 적용하면된다.
notion image
게임 페이지에 한에서만 적용되도록 하여 아래 영상에서 보이는것 처럼 이제 새로고침이 발생하지 않게 되었다.
적용 전 후 비교:
notion image
notion image
참고:

© 2024 dan.dev.log, All right reserved.

Built with NextJS