[JS] 모달 창 띄울 때 레이아웃 깨짐 없이 스크롤 막는 법
1. 들어가기 전에…모달창(modal)은 사용자가 특정 작업을 수행하도록 유도하는 팝업창이다.모달은 창 이외의 영역을 흐리게 만들어 사용자가 창을 닫거나 작업을 완료하기 전까지 다른 부분을 조작할 수 없도록 만든다. 아래 gif는 부트스트랩의 모달 예시이다.https://getbootstrap.kr/docs/5.0/components/modal/#모달-간-토글앞서 언급했듯이, 모달은 사용자가 특정 작업을 수행하도록 유도하는 역할을 한다.그런데 만약 모달이 열릴 때 창 이외 영역에서 스크롤이 가능하면 어떨까?아래 gif는 모달이 열려있을 때, 창 이외 영역에서 스크롤이 발생하는 예시이다.예시를 보면, 모달 이외의 영역으로 주의가 분산되기에 사용자 경험이 저하될 수 있다.그럼 어떻게 해야, 모달 이외의 영역..
2024. 6. 11.
