반응형 JS57 [JS] addEventListener addEventListener() document의 특정요소event를 등록할 때 사용합니다. [ 자주 사용하는 이벤트의 종류 ] click – 마우스버튼을 클릭하고 버튼에서 손가락을 떼면 발생한다. mouseover – 마우스를 HTML요소 위에 올리면 발생한다. mouseout – 마우스가 HTML요소 밖으로 벗어날 때 발생한다. mousedown – 클릭을 하기 위해 마우스버튼을 누르고 아직 떼기 전인 그 순간, HTML요소를 드래그할 때 사용할 수 있다. mouseup – 마우스버튼을 떼는 그 순간, 드래그한 HTML요소를 어딘가에 놓을 때 사용할 수 있다. mousemove – 마우스가 움직일때마다 발생한다. 마우스커서의 현재 위치를 계속 기록하는 것에 사용할 수 있다. focus – HTML요.. 2023. 10. 22. [JS] querySelector querySelector함수를 이용해서 html에 있는 요소를 불러올 수 있다. [js] const searchEl = document.querySelector('.search') const searchInputEl = searchEl.querySelector('input') // 검색창 요소를 클릭하면 실행. searchEl.addEventListener('click', function () { searchInputEl.focus() }) // 검색창 요소 내부 실제 input 요소에 포커스되면 실행. searchInputEl.addEventListener('focus', function () { searchEl.classList.add('focused') searchInputEl.setAttribut.. 2023. 10. 22. [JavaScript] const & let const는 상수이다. 상수의 값은 재할당할 수 없다. 예를 들어보자 // MY_FAV를 상수로 정의하고 그 값을 7로 함 const MY_FAV = 7; // 에러가 발생함 MY_FAV = 20; // 7 출력 console.log("my favorite number is: " + MY_FAV); 그 외에는 기본적으로 let을 사용한다. 원래는 var를 사용했다고 하는데 수많은 문제점과 그로 인해 버그를 일으킬 수 있다는 이유로 현재는 var보다 let을 쓴다고 한다. 2023. 10. 22. [JS] ScrollMagic 이쯤되니까 대체 사용하는 JS 라이브러리가 몇 개여;;;; 물론 편하기는 한데… 라이브러리라는 말 써서 뭔가 있어보이기는 한데, 결국에는 여기저기서 긁어왔습니다^_^ 아닌가… 이거 맞는건가… 그래도 결과물만 좋으면 되니까 말이지… https://scrollmagic.io/ ScrollMagic The javascript library for magical scroll interactions. ScrollMagic helps you to easily react to the user's current scroll position. scrollmagic.io 이 코드를 다들 CDN이라고 부르더라... 기억하자. CDN!!! Ex ) /** * 요소가 화면에 보여짐 여부에 따른 요소 관리 */ // 관리할 요소.. 2023. 10. 11. 이전 1 ··· 11 12 13 14 15 다음 반응형