2014-09-25 3 views
0

ul > li으로 탐색 메뉴를 만들었습니다.
메뉴는 실제로 페이지 중앙에 있습니다.
내가 원하는 것은 스크롤하는 동안에 만 내 메뉴가 페이지 상단에 있습니다.스크롤하는 동안 탐색 메뉴가 페이지 상단에 머물러있게 만드는 방법은 무엇입니까?

나는 CSS를

.menu { 
    position:fixed; 
    top:0; 
    float:left; 
} 
.menu li { 
    float:left; 
    padding:10px; 
    margin:2px; 
} 

를 사용하여 작업을 수행 할 수 있습니다하지만 난 단지 스크롤 할 때 실제로 나는이 필요합니다. 어떤 사람이 어떤 솔루션 :

답변

2

를 제안 할 수이 시도 : -

<script> 
$(document).ready(function(){ 

    // hide targeted element first 
    $("#xg_navigation").hide(); 

    // fade back in targeted element 
    $(function() { 
     $(window).scroll(function() { 
     if ($(this).scrollTop() > 50) { 
      $('#xg_navigation').fadeIn(); 
     } else { 
      $('#xg_navigation').fadeOut(); 
     } 
    }); 
}); 

}); 
</script> 
1

당신은이 같은 작업을 수행 할 수 있습니다

$(window).scroll(function() { 
    if ($(document).scrollTop() > 100) 
    { 
     $('.menu').addClass('fixed'); 
    } 
}); 

CSS :

.fixed {위치 : 고정; }

사용자가 페이지 상단으로 다시 스크롤 할 때 클래스 고정 양식 .menu를 제거해야합니다.

관련 문제