1번 질문
----------------
상단 컨테이너를 구성하는 div 요소가 있는데 class가 header로 되어 있다면 이 컨텐이너는 상단 영역으로 제한해야 되지 않을까요? 아래와 같이 수정되어야 하겠습니다. 즉 div 태그를 종료해 해주세요.(끝에 </div> 삽입) 당연히 잘못 작성된 해당 종료 태그는 제거 해야겠지요.
<!--기존 코드-->
<div id="header" class="about-header">
<ul>
<li data-section="1">뮤스토리는</li>
<li data-section="2">원장소개</li>
<li data-section="3">학원내부</li>
</ul>
<!-- 수정된 코드 -->
<div id="header" class="about-header">
<ul>
<li data-section="1">뮤스토리는</li>
<li data-section="2">원장소개</li>
<li data-section="3">학원내부</li>
</ul>
</div>
다음은 자바스크립트 파트인데 선택자가 잘못 작성되어 있습니다. 아래와 같이 수정해야 하겠습니다. 즉 $("about-header")를 $(".about-header") 로 수정해야 합니다.
$(window).scroll(function() {
var docTop = $(window).scrollTop();
if (docTop > 0) {
$(".about-header").addClass("about-header-fixed");
} else {
$(".about-header").removeClass("about-header-fixed");
}
});
2번 질문
-----------------
먼저 HTML을 완벽하게 작성한 후 자바스크립트 작업을 해주세요. 원하는대로 레이아웃이 나온 상태에서 자바스크립트 작업을 해주시되 HTML 작업을 하시다가 해결이 안되면 다시 작업중인 HTML 코드로 질문을 남겨주시면 답변 드리겠습니다.