페럴렉스1 [페럴렉스] 스크롤을 감지하여 순간마다 CSS 위치값 적용 적용 예제 보기 http://designup.kr/study/js_parallax/ 작업 소스 주요 코드 1. 먼저 달, 산배경 이미지와 글자 들을 css로 위치를 잡아주고 2. 자바스크립트로 마우스 스크롤을 감지하여 각 요소들의 위치값을 변경시켜준다. 3. 부드럽게 이동시키기 위해 css 트랜지션을 이용한다. 자바스크립트 window.addEventListener('scroll', function(){ //스크롤시 이벤트가 실행된다. let value = window.scrollY; //세로 스크롤 값을 value 함수에 저장한다. stars.style.left = value * 0.25 + 'px'; //스타의 left값을 세로 스크롤 값 만큼 이동시킨다. moon.style.top = value *.. 2021. 10. 23. 이전 1 다음