featherlight을 사용했을 때 취업한 학생들처럼 body의 overflow:hidden이 자유자재로 되려면..

코딩웍스 강사님 안녕하세요!

앞 강의에서 플러그인질문은 여쭤봐도 알려주시기가 난감하셨다 하셨지만, 취업한 학생분들 홈페이지도 제가 하고자 하는 홈페이지대로 되어있어서.. 여쭤봅니다.

해당 강의의 9:57 에서 강사님께서 pc버전을 눌렀을 때 취업한 학생분의  모달창 healing art 홈페이지의 오른쪽부분을 보면 세로스크롤이 한줄이고,  모달창을 꺼도 개인홈페이지가 계속 스크롤할수있는데,

제 홈페이지의 스크롤을 보시면

이 스크린샷이 featherlight를 사용해서 모달창을 띄운 상태입니다.

스크롤 두개중에, 왼쪽 스크롤이 featherlight를 이용해서 나온 포폴홈페이지이고, 오른쪽 스크롤이 개인홈페이지입니다.

취업한 학생분의 홈페이지처럼, featherlight을 이용한 홈페이지가 나오면 개인포폴홈페이지는 잠시 움직이는걸 멈추게하고 싶어서,

반응형 강좌때 (모달창띄울때 body가 움직이는걸 방지할경우)이럴 경우엔 body에 overflow를 주면된다고하셔서 jquery로 $('body').addClass('active') 해보았습니다만

body에 addClass('active')는 적용되는데,

$('.featherlight-close-icon')를 클릭했을때, body removeClass('active')는 어떻게해도 적용이 안됩니다.

선택자가 잘못된건가싶어서,  F12로 확인해서

.featherlight-close-icon

.featherlight-close

.close

.featherlight-close-icon.featherlight-close

.featherlight.featherlight-iframe .featherlight-content .featherlight-close-icon.featherlight-close

여기 있는 선택자들로도 바꿔봤는데도 안되더라구요.

방법이 잘못된걸까요?

공유해주신 featherlight.css에도 나와있지않아서 여쭤봅니다.

 ↓ 밑의 코드는 css파일과 js파일에 각각 작성하였지만 복붙하니까 이어붙여서 보이네요.

.view 는 pc버전보기 버튼입니다!