아래와 같이 두개의 배열이 있을 때, 두 배열에 모두 존재하는 객체를 찾아 반환해야 하는 코드를 짜야 했었다. 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"}]; 반복문을 ..

라디오버튼을 구현 하다 보면 조금 더 디자인에 맞게 라디오 버튼의 동그라미 부분을 커스텀 하고 싶을 때가 있다. 그럴때는 이미 기본으로 잡혀져 있는 구성들을 none 처리 해준 뒤 (여기서 다른 웹 사이트들의 기본 설정도 none 처리 해줌) 원하는 모양 대로 그려 나가면 된다.    See the Pen Untitled by Kate lee (@Kate-lee-the-encoder) on CodePen.">See the Pen Untitled by Kate lee (@Kate-lee-the-encoder) on CodePen.   input[type='radio'] { //input type이 radio인 모든 것들 -webkit-appearance: none; //웹킷 기본 구성 없음 ..

[Javascript] 클릭해서 드래그로 가로 스크롤 구현 하기 (click and drag)[목표]가로 스크롤이 필요한 부분을 제공하는 스크롤을 이용해서가 아닌 마우스로 클릭 후 드래그하는 방법으로 구현해보고자 한다.  [코드] 1. 변수 및 초기화 //스크롤을 할 컨테이너를 선택henniee.tistory.com위의 글과 연결 되는 내용인데, 내가 윈도우로 가로 드래그를 구현 후 맥에서 빌드를 하면 자꾸 드래그가 안된다는 이슈가 발생하여 아예 마우스의 휠로 드래그를 할 수 있게 스크립트를 만들었다.  [코드]scrollContainer.addEventListener("wheel", (e) => { e.preventDefault(); const delta = e.deltaY || e.deta..

[목표]가로 스크롤이 필요한 부분을 제공하는 스크롤을 이용해서가 아닌 마우스로 클릭 후 드래그하는 방법으로 구현해보고자 한다.  [코드] 1. 변수 및 초기화 //스크롤을 할 컨테이너를 선택 const scrollContainer = document.getElementById("scrollContainer");let isMouseDown = false; //사용자가 마우스를 클릭 했는지 여부를 추적let startX; // 마우스를 클릭한 최초의 x 좌표 let scrollLeft; // 드래그 시작 시 컨테이너의 가로 스크롤 위치 2. 마우스 누를때 이벤트  scrollContainer.addEventListener("mousedown", (e) => { isMouseDown = tr..