window.addEventListener('mousemove', function(e){ mousePos.x = -1 + (e.clientX / window.innerWidth)*2; mousePos.y = 1 - (e.clientY / window.innerHeight)*2; spaceElem.style.transform = `rotateX(${mousePos.y*8}deg) rotateY(${mousePos.x*8}deg) `; });

https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll Window.scroll() The Window.scroll() method scrolls the window to a particular place in the document. developer.mozilla.org ※MDN에 기본적인 설명 참조 window.scroll(x좌표 ,y좌표) //이렇게 사용하거나 window.scroll({ //이렇게 세세한 옵션을 줄 수 있다. top: 100, //y축(상,하)방향으로 left: 100, //x축(좌,우)방향으로 behavior: 'smooth' 또는 'auto' //스크롤 이동 시 스크롤의 움직임을 설정 }); See the Pen XWd..

타겟 요소.offsetTop은 스크롤(속도)의 영향을 받지 않아야 하는 것, 고정적이어야 하는 것을 필요로 할 때 유용하다. offsetTop은 기본적으로 document의 상단에서 해당 요소가 얼마나 떨어져 있는지의 값을 나타낸다. 그런데 만약, 내가 구하고자 하는 요소의 offsetTop값이 문서가 기준이 아니라 타겟의 부모 요소를 기준으로 하고 싶다면 (쉽게 말해, 문서 상단에서 타겟 요소 상단 까지 사이의 거리가 아닌, 부모 요소의 상단에서 해당 요소 상단부분 까지의 거리) position 속성을 이용해서 offsetTop의 기준 값을 바꿀 수 있다. 우리가 position: absolute를 사용할 때 처럼, 기준으로 잡을 부모 요소에 position: relative를 해주면 된다.

2015년 책이라 좀 오래되긴 했지만, 내용도 짧고 ES6 기반 설명이라 읽어보면 좋을 것 같다. https://www.hanbit.co.kr/realtime/books/book_view.html?p_code=E5027975256 JavaScript Promise 최근 몇 년, 웹에서는 다양한 변화가 일어나고 있다. HTML5나 ECMAScript6 등 새로운 표준 기술이 잇달아 고안되는 등 웹의 세계는 빠르게 변화하고 있다. 브라우저는 그 변화에 대응하기 위해 릴리즈 www.hanbit.co.kr

Sass와 Scss의 차이는 세미콜론을 붙이느냐, 안 붙이느냐 그리고 대괄호로 묶어주냐 마냐이다. 전자가 Scss이다. 1. 변수를 사용할 수 있다. 변수 정의 시 $기호 사용한다. $font-stack: nanum-gothic, sans-serif; $primary-color:#333; $url-images: 'assets/images/'; body{ font:100% $font-stack; color:$primary-color; background: $primary-color url($url-images + 'img-names.jpg'); } 2. 중첩이 가능하다. $default-color:#999; $navhover-color:#333; nav{ ul{ list-style:none; li{ dis..

프로그래머스 문제 읽을 때면 종종 읽어도 읽은 것 같지 않은 느낌이 들 때가 많다.ㅎㅎ 많이 풀어보면 쉬워지겠지..ㅎㅎ흑 문제) 과정) 첫번째, 스트리밍 총합이 큰 장르 순으로 내림차순 정렬 되어야 하고, 두번째, 각 장르별 스트리밍 수가 많은 노래를 내림차순 정렬 세번째, 정렬된 상태에서 각 장르별로 노래 두개를 뽑아야 한다. 장르에 노래가 하나 뿐일 경우 하나만 뽑는다. 총 반환되는 값은 장르*2 ( - 알파)가 된다. 내가 재출한 해설) function solution(genres, plays) { let answer = []; let genres_ = Array.from(new Set(genres)); //중복 제거한 장르만 모아놓음 let target = []; genres_.forEach((g..