고수분들이 보시기엔 굉장히 간단한거에요 ㅎㅎ
마우스 휠을 아래로 내리면 위에 메뉴부분이 흰색테두리로 드러나는데요
이게 마우스를 안내리고 그냥 아예 흰색으로 할순없나요 ㅠㅠ 휠 내리면 그냥 변화없이 내려오게요
소스보기하시면 됩니다 바로나와요 ㅎㅎ
|
답변 2개
채택된 답변
+20 포인트
2015-12-17 (목) 11:47:50
간단하게 메뉴박스 스타일에 fixed 스타일을 붙여넣으시면 될거같네요.
.menu_box{
background:rgba(255,255,255,255.5); transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out;
width:100%; height:90px; color:#FFF; position:fixed; transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out;}
2015-12-17 (목) 11:47:05
Copy
/**스크롤이 설정한 높이 이상 내려갔을때 스타일추가하기**/ if (jQuery(window).width() > 0) { jQuery(window).on("scroll",function(ev){ if(jQuery(window).scrollTop() > 150 ) { /**높이 픽셀 조정**/ jQuery('.menu_box').addClass('fixed'); /**위의 높이에서 .fixed 클래스를 추가합니다. 스타일에서 자유롭게 수치 조절 가능합니다.**/ } else{ jQuery('.menu_box').removeClass('fixed'); } return false; }); }
부분을
Copy
jQuery('.menu_box').addClass('fixed'); /**스크롤이 설정한 높이 이상 내려갔을때 스타일추가하기**/ if (jQuery(window).width() > 0) { jQuery(window).on("scroll",function(ev){ if(jQuery(window).scrollTop() >= 0 ) { /**높이 픽셀 조정**/ jQuery('.menu_box').addClass('fixed'); /**위의 높이에서 .fixed 클래스를 추가합니다. 스타일에서 자유롭게 수치 조절 가능합니다.**/ } else{ jQuery('.menu_box').removeClass('fixed'); } return false; }); }
로 수정하면 되지 않을까 싶네요.
답변을 작성하려면 로그인이 필요합니다.