네비게이션 상단픽스 채택완료
반응형 웹으로 코딩 중입니다.
PC화면에서는 스크롤해서 아래쪽으로 내려 갈 경우
중간에 있던 메뉴(네비게이션)가 상단에 고정되도록 픽스 시켰는데,
스맛폰 화면으로 작아졌을 경우에는 픽스되지 않도록 하고 싶습니다.
</strong><span style="font-size: 10pt; line-height: 1.5;"></span></p><p>jQuery(function($){</p><p>var nav = $('#fixedBox'),</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>offset = nav.offset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(window).scroll(function () {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if($(window).scrollTop() > offset.top) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>nav.addClass('fixed');</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>} else {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>nav.removeClass('fixed');</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p>}); </p><p><strong style="font-family: 돋움, dotum, helvetica; font-size: 12px; line-height: 21.6000003814697px; background-color: rgb(255, 255, 255);">
이 코드를 써서, #fixedBox라는 div에 fixed라는 클래스를 붙여서 CSS에서 픽스되도록 입력 해 놓았는데,
저 코드에서 어디를 어떻게 수정해야
사이즈가 작아졌을 때는 fixed라는 클래스가 붙지 않도록 할 수 있을까요?
가르침 주시면 감사하겠습니다^^
답변 3개
if( ($(window).scrollTop() > offset.top) && window.innerWidth > 419 ) {
nav.addClass('fixed');
}
window width가 420 이상일 경우에만 fixed 클래스가 붙습니다.
답변에 대한 댓글 2개
알려주신대로 적용해서 해결했습니다 ^^
복 받으실 거예용 ㅎㅎ
댓글을 작성하려면 로그인이 필요합니다.
답변에 대한 댓글 1개
답변 감사합니다 ~
댓글을 작성하려면 로그인이 필요합니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
if( ($(window).scrollTop() > offset.top) && $(window).innerWidth() > 419 ) {