끈적 헤더/자바 스크립트

Question

안녕하세요. 내 사이트의 끈적한 헤더에서 작업 중입니다. 작동하지만 딱딱한 느낌으로 부드럽게 보이고 싶습니다. 이 일에 어떻게 가야합니까?

내 사이트 : http://www.trevorpeters.co.uk/tpwebdesign

CSS :

.sticky { 
    position: fixed; 
    width: 100%; 
    left: 0; 
    top: 0; 
    z-index: 100; 
    border-top: 0; 
} 

JS 기본적으로

$(document).ready(function() { 
var stickyNavTop = $('.nav').offset().top; 

var stickyNav = function(){ 
var scrollTop = $(window).scrollTop(); 

if (scrollTop > stickyNavTop) { 
    $('.nav').addClass('sticky'); 
} else { 
    $('.nav').removeClass('sticky'); 
} 
}; 

stickyNav(); 

$(window).scroll(function() { 
    stickyNav(); 
}); 
}); 

Answer 1

헤더가 문서 흐름에 아래 내용의 나머지 부분을 '밀어'. 끈적 거리게 만들면 문서의 나머지 부분이 아래로 밀려 올라 가게됩니다. 배너를 처음부터 끈적 거리게 만들고 내용의 헤더 높이만큼 위쪽 여백을 주면이 문제를 해결할 수 있습니다. 이 방법을 사용하면 자바 스크립트를 모두 제거 할 수 있습니다.