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

jquery 질문 채택완료

질문하는사람 6년 전 조회 1,903

 

해당 이미지를 보면 위에 top 메뉴바가 내려오면서 밑에 메뉴바가 툭 부딪히면서 같이 내려오는데

어떻게 해야하나요?

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

답변 2개

채택된 답변
+20 포인트
아르키어드

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

http://dvisign.com/g5/

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

</p>

<p>$(window).on("mousewheel DOMMouseScroll scrollstart scrollstop scroll",function(){</p>

<p>    var winpos = $("html").scrollTop();</p>

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

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

<p>    if (winpos >= target) {</p>

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

<p>    } else {</p>

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

<p>    }</p>

<p>});</p>

<p>

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

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

베원
6년 전

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

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

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

 

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

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

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

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

로그인