jquery 질문

Question

해당 이미지를 보면 위에 top 메뉴바가 내려오면서 밑에 메뉴바가 툭 부딪히면서 같이 내려오는데 어떻게 해야하나요?

아르키어드 · Accepted Answer

아래 코드는 로고가 있는 네비게이션이 시작부터 fixed css를 갖고있을때를 가정한 코드입니다

엘리먼트 콘솔창에서 var oldpos 찾아보시면 해당 비슷한 코드가 있습니다

Copy

$(window).on("mousewheel DOMMouseScroll scrollstart scrollstop scroll",function(){

    var winpos = $("html").scrollTop();

    var fixpos = $("로고가있는 픽스네비게이션").height();

    var target = $("로스트아크 그림을 감싸고 있는 대상").position().top + fixpos ;   

    if (winpos >= target) {

        $("픽스할 네비게이션").css({ "position":"fixed","top":fixpos + "px" })

    } else {

        $("픽스할 네비게이션").css("position","static");

    }

});

베원 · Answer

onscroll 이벤트로 스크롤 위치를 계속해서 확인합니다.

이 위치가 특정 위치(질문하신 바에 따르면 부딪히는 위치)이상이 되는 경우 css상의 position:fixed, top:고정될 위치 옵션을 추가합니다.

특정 위치 미만이 되는 경우에는 이 옵션을 삭제합니다.

옵션을 class로 만들어서 class를 추가하고 제거하는 방식으로 하면 더 좋겠죠?

jquery 질문

답변 2개

공유하기