기초공사 (html,css,javascript)
About animation해결 본문
// About in majors 부분 - 해냈다!!
const about = document.querySelector('#about');
const aboutHeight = about.getBoundingClientRect().height;
//처음엔 querySelectorAll로했다가 안되서 생각해보니 각각 줘야하니..각가 주게되니 실행이 되었다....
와 이거 몰라서 엄청 헤맸었는데..일단 실행은 되서 좋긴하지만, forEach로 바꾸는 법을 알아야겠다.
그래도 노력 끝에 되서 너무 좋다..이맛에 코딩이지!
const inMajors_f = document.querySelector('.in_majors.first'); /*li들*/
const inMajors_s = document.querySelector('.in_majors.second'); /*li들*/
const inMajors_e = document.querySelector('.in_majors.last'); /*li들*/
console.log(`aboutHeight: ${aboutHeight}`);
function aboutScroll(){
if(window.scrollY + 50 > aboutHeight) {
inMajors_f.classList.add("visible"),
inMajors_s.classList.add("visible"),
inMajors_e.classList.add("visible");
} else {
inMajors_f.classList.remove("visible"),
inMajors_s.classList.remove("visible"),
inMajors_e.classList.remove("visible");
}
};
document.addEventListener("scroll", aboutScroll);
'코드리뷰_정리' 카테고리의 다른 글
About animation해결 (0) | 2022.06.27 |
---|---|
포폴_JS정리 (0) | 2022.06.22 |