그누보드 모바일 메뉴 열고 두번 밑으로 스크롤시 메인페이지가

그누보드 모바일 메뉴 열고 두번 밑으로 스크롤시 메인페이지가

QA

그누보드 모바일 메뉴 열고 두번 밑으로 스크롤시 메인페이지가

답변 3

본문

그누보드 모바일 메뉴 열고 두번 밑으로 스크롤시,

메인페이지가 스크롤 되면서,

메뉴 뒤에 원페이지(메인페이지에서 메뉴를 열었다면 메인페이지)가 스크롤 되는거 막는법없나요?

이 질문에 댓글 쓰기 :

답변 3

메뉴가 열렸을 때 메인 페이지의 스크롤을 비활성화하는 방식을 사용.

 

JavaScript 또는 jQuery를 사용하여

메뉴가 열릴 때

body 요소에 overflow: hidden; 스타일을 적용하거나, 클래스(.no-scroll 등)를 추가.

메뉴가 닫힐 때는

이를 제거하여 정상적인 스크롤 동작을 복구.

예로, 메뉴 버튼 클릭 이벤트에서 다음 코드를 실행


$(".menu-button").on("click", function () {
    $("body").addClass("no-scroll"); // 스크롤 비활성화
});
// 메뉴 닫기 시
$(".menu-close").on("click", function () {
    $("body").removeClass("no-scroll"); // 스크롤 복구
});

CSS로 .no-scroll 클래스 설정


.no-scroll {
    overflow: hidden;
    position: fixed;
    width: 100%; /* 화면 크기 고정 */
}
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 145
© SIRSOFT
현재 페이지 제일 처음으로