두 가지 질문이 있습니다 ㅠㅠ

Question

섹션 7에서 사용한 인터렉션을 첫 번째 상위 섹션에 사용하고 svg인터렉션을 하위 섹션에서 사용하고싶은 상황입니다. 질문 1. 해당 svg인터렉션 코드를 사용하니 상위에 있는 섹션7의 배경문이 열리는 인터렉션이 실행되지 않는 이유를 모르겠습니다 ㅠㅠ 질문2. svg인터렉션 을 하위섹션에 사용하고싶은데 윈도우 시작 부터 svg가 그려지는것을 해당 섹션에서 부터 그려지게 하고싶은데 방법을 모르겠습니다..  귀찮으시겠지만 도와주시면 감사드려요!!

28375998437 · Answer

감사합니다!!!! 해결이 되었어요

ggangcoding162118 · Answer

안녕하세요 :D 어려운 부분이 있으셨군요! 답변드리겠습니다 :) 질문1. 답변 섹션7과 섹션11을 병합하는 과정을 어떻게 하셨는지 모르겠지만 스크립트 코드를 합칠땐 중복되는 코드가 있을 수 있을 수 있으므로 해당 섹션 코드를 각각의 함수로 감싸주면 스크립트 오류는 발생하지 않을거에요 :) 조금 더 자세히 알고 싶다면 자바스크립트 기초 스코프에 대해 공부해보세요! 예) 예를 들면 아래와 같이 간단하게 레디 펑션으로 감싸줘도 됩니다 :) $(function(){ 섹션7코드... }); $(function(){ 섹션11코드... });   질문2. 답변 질문2는 앞전 수업을 자세히 들으셨다면 혼자서 해결할 수 있을테니 여유가 생기면 다시 한번 공부해 보시길 추천드립니다 :)   먼저 섹션 7 코드는 position: sticky로 작성되어 있고 섹션 11은 position: fixed로 작성되어 있습니다. 두개의 코드를 합치기 위해선 섹션11의 css코드를 섹션7과 같이 position: sticky로 변경해 주어야 합니다. 그다음 css 수정이 끝났다면 섹션11 자바스크립트 수식 수정을 해주면 되는데요 이전에 배웠던대로  섹션11 스크립트의 스크롤 탑 값에서 두번째 섹션의 오프셋 탑 값을 빼주고 스크롤 거리를 svg섹션의 거리로 변경해 주면 됩니다. 아래와 같이 말이죠! function drawSvg () { var winScrollTop = $ (window) . scrollTop () - $ ( '. 두번째svg섹션 ' ) . offset () . top ; var scrollHeight = $ ( '.두번째svg섹션' ) . height () ; 약간의 코드만 수정하면 되기 때문에 위 내용을 토대로 코드를 수정해 보시고 만약 어려움이 있다면 전체 코드를 보내드리도록 하겠습니다 :)   그럼 또 다른 궁금증이 생기면 문의주세요 :D