퍼블리싱수업 - 자바스크립트

질문리스트

sm2

1. header의 height가 100px인거와, --height가 0인거 두개의 차이가 뭔지? 용도가 뭔지?
2. hover시, header의 height가 바뀌는데 왜 변하는게 없어보이는지? height가 변하지 않는다면 무슨 쓸모가 있는건지?
3. header:before를 준 이유? before를 줬으면 header보다 뒤에 들어가야하는데, 빨간색이 튀어나오는 이유?
4. before에 red 색상을 준 이유? ul / li에 직접 주지 않은 이유??

sm3

1. tabName = $(this).data('tab') 의 this 는 $('.tab-list a').click .tab-list의 a들중 클릭한걸 지칭하는게 맞는지?
2. $(this).addClass('on') 에서 this가 지칭하는게 뭔지?
3. this가 뭔지 알아내는 방법이 뭔지....
4. ('.tab-list a').removeClass('on') $(this).addClass('on') '.tab-list의 a' 에 'on'클래스를 없애고, this에?(this 가 뭔지모르지만) on 클래스를 붙인다?
   $(tabName).addClass('on').siblings().removeClass('on') 는 tabName이 지칭한 것중 on클래스가 붙은것의 형제에 on을 없앤다 가맞는지?
5. 스크립트에는 전부 tab-list에 관련된거만 있는데, 어떻게 tab-cont는 컨트롤이 되는지..

sm4

1. 스크립트 안에, '.title'을 클릭하고, 만약 this에 on이라는 클래스가 있다면, 이라는 스크립트 밖에 없는데 on을 켰다끄는건 어떤 문장안에 들어있는건지? 왜 title클릭시 on이 자동으로 붙었다 떨어지는건지? 절차가 1.title을 클릭한다, 2.해당 title에 on이라는 클래스가 있다면, title에 on이라는 클래스를 제거하고 .sub의 형제요소를 멈추고, 슬라이드업 시킨다. 인거로 해석되는데, title에 on이 붙게되는 작업은 어디서 실행되는건지 궁금합니다.