위치 추가 후 내용 이동 방지 방법 : 서브 헤드에 고정?

Question

저는 현재 여기에서 볼 수있는 새로운 포트폴리오를 만들고 있습니다 : http://katharinakoeth.de/neu/ 그리고 이미 내 문제가 있습니다. 보시다시피 junkery 액션을 내 하위 머리글에 추가했는데 (자바 스크립트의 경우 초급입니다.) 상속에서 고정/고정으로 위치를 변경했습니다.하지만 변경이 발생하면 내 콘텐츠가 갑작스런 공간. » "내가 좋아하는 사람들과"가장 분명합니다 ... 첫 번째 인물이 갑자기 하위 헤드가 끈적 해지면 사라집니다.

여분의 공간을 추가하거나 다른 방법으로 도약을 방지 할 수있는 방법이 있습니까?

Answer 1

해당 하위 머리글을 position : fixed로 변경하면 문서의 흐름에서 제거됩니다. 그것들은 margin-bottom : 75px를 가지고 있는데, 그때 그 흐름에서 제거됩니다.

여백 - 상단 : 75px를 각 하위 헤더 아래의 블록 시작 부분으로 변경하십시오. 하위 헤드가 위치 값을 변경할 때 "사라지지"않으므로 간격을 유지해야합니다.

Answer 2

참고로, 귀하의 fix.js 파일은 아마 이런 식으로 아래로 리팩토링 수 :

var $titles = $("header h2"); 
$(window).scroll(function(){ 

    var win_top = $(this).scrollTop(); 
    $titles.each(function(){ 
     var div_top1 = $(this).offset().top; 
     if (win_top > div_top) $(this).addClass('stick') 
     else $(this).removeClass('stick'); 
    }); 

});