자바스크립트응용1 [자바스크립트 응용] 페럴렉스 효과02 / 스크롤변화에 따른 효과 적용하기 패럴랙스 효과 02 패럴랙스 스크롤링은 사용자가 마우스를 스크롤할 때, 원거리에 있는 배경 이미지는 느리게 움직이게 하고, 근거리에 있는 사물 이미지는 빠르게 움직이도록 함으로써 입체감을 느낄 수 있게 만든 디자인 기법입니다. 오늘은 저번시간에 이어서 사이드바 메뉴로 구성하는 방식에 대해 알아보겠습니다. 원본 소스 보기 원본 사이트 ▶ 저번시간과 원리는 별반 다를게 없습니다. 'parallax__info span'에 현재 scrollTop값을 입력되게 해주고, 'scrollTop >= 각 섹션 offsetTop' 일때 해당되는 섹션의 메뉴버튼에 active클래스를 붙여줍니다. 또, 메뉴버튼에 해당되는 a링크에 preventDefault를 부여해서 a태그 고유기능은 막고 scrollIntoView를 주어서.. 2022. 9. 12. 이전 1 다음 반응형
