테스트 사이트 - 개발 중인 베타 버전입니다

스크롤에 반응하는 헤더가 사이드 메뉴바를 갖고 있을 때의 오류

남행 3년 전 조회 2,655

스크롤을 아래로 내리면 헤더가 사라지고 위로 올리면 나타나는 모바일 헤더를 만들었는데요. 문제는 헤더에 사이드 메뉴바가 있는데 메뉴바를 누르고 별다른 이동 없이 메뉴바를 다시 닫았을 때 헤더에 준 스크립트 효과가 적용이 안됩니다 ㅠㅠ

그냥 fixed가 되어버려요.. 사이드 메뉴바를 눌러도 상관 없이 적용될 순  없을까요? 

 

html은 헤더와 사이드바가 서로 형제 관계에 있고, 둘다 fixed 입니다. 사이드바를 헤더 안에 넣으면 구조가 망가지는 것  같고.. 

스크립트는 아래와 같이 적용한 상태입니다 ㅠㅠ

 

</p>

<p>var lastScrollTop = 0;

    

    $(window).scroll(function(){

        var scrollTop = $(this).scrollTop();

        if(scrollTop >= 100) {

            if((scrollTop > lastScrollTop) && (lastScrollTop>0)) {

                $('#header_scroll').css("top","-100px");

            }

            else {

                $('#header_scroll').css("top","0px");

            }

            lastScrollTop = scrollTop;

        }

    });</p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

메뉴바 관련 스크립트도 올려주셔야 할것 같습니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인