자바스크립트 두 배열에서 공통 객체 찾기 Array.prototype.some()
·
Front/javascript
아래와 같이 두개의 배열이 있을 때, 두 배열에 모두 존재하는 객체를 찾아 반환해야 하는 코드를 짜야 했었다. const a = [ {name: "jake", age: "11", school: "tes"}, {name: "luna", age: "13", school: "tes"}, {name: "leo", age: "7", school: "sin"}];const b = [ {name: "jake", age: "11", school: "tes", add: "13st"}, {name: "luna", age: "15", school: "tes", location: "downtown"}, {name: "leo", age: "7", school: "sing", city: "london"}]; 반복문을 ..
[Javascript] 마우스 휠을 통해서 가로 드래그 하기
·
Front/javascript
[Javascript] 클릭해서 드래그로 가로 스크롤 구현 하기 (click and drag)[목표]가로 스크롤이 필요한 부분을 제공하는 스크롤을 이용해서가 아닌 마우스로 클릭 후 드래그하는 방법으로 구현해보고자 한다.  [코드] 1. 변수 및 초기화 //스크롤을 할 컨테이너를 선택henniee.tistory.com위의 글과 연결 되는 내용인데, 내가 윈도우로 가로 드래그를 구현 후 맥에서 빌드를 하면 자꾸 드래그가 안된다는 이슈가 발생하여 아예 마우스의 휠로 드래그를 할 수 있게 스크립트를 만들었다.  [코드]scrollContainer.addEventListener("wheel", (e) => { e.preventDefault(); const delta = e.deltaY || e.deta..
[Javascript] 클릭해서 드래그로 가로 스크롤 구현 하기 (click and drag)
·
Front/javascript
[목표]가로 스크롤이 필요한 부분을 제공하는 스크롤을 이용해서가 아닌 마우스로 클릭 후 드래그하는 방법으로 구현해보고자 한다.  [코드] 1. 변수 및 초기화 //스크롤을 할 컨테이너를 선택 const scrollContainer = document.getElementById("scrollContainer");let isMouseDown = false; //사용자가 마우스를 클릭 했는지 여부를 추적let startX; // 마우스를 클릭한 최초의 x 좌표 let scrollLeft; // 드래그 시작 시 컨테이너의 가로 스크롤 위치 2. 마우스 누를때 이벤트  scrollContainer.addEventListener("mousedown", (e) => { isMouseDown = tr..
[Javascript] scrollHeight 와 clientHeight 에 대해 알아보자
·
Front/javascript
코드를 짜던 도중 textarea가  text 높이에 따라 자동으로 높이 조절을 구현 하고 싶었다.  textAreaElement.style.height = textAreaElement.scrollHeight + 'px'; 이렇게 적어주면 된다는 많은 블로그들의 말에 따라 했는데 이상하게 낮은 버전의 web에서는 이게 안먹히는것이다...... 그래서 원인을 찾던 중 알게 된 scrollHeight 와 clientHeight를 간단하게 작성해보려고 한다.  scrollHeight정의: 요소의 전체 콘텐츠 높이로, 스크롤 여부와 상관없이 요소 내의 모든 콘텐츠 높이를 포함.특징: 요소의 내부 콘텐츠가 현재 뷰포트에 보이지 않더라도 해당 영역까지의 전체 높이를 반환.예시: 텍스트가 많아 세로로 스크롤이 필요한..
해니01_15
'Front/javascript' 카테고리의 글 목록