
🎯 양쪽 화살표가 작동시키기 🎯 4개짜리 카드가 존재하는 FINAL 미션에선 화살표가 필요없기 때문에 나타나지 않도록 만들어주자 -> main.js의 반복문이 두번밖에 돌지 않는다. 그래서 첫번째 위치하는 계급미션에서는 화살표가 사라지지만, 아래에 위치한 video-list에서는 사라지지 않는 것이다. => 비동기적 문제일까? slide-prev.parentElement = arrow-container slide-prev.parentElement.parentElement = mission-title-container slide-prev.parentElement.parentElement.nextElementSivbling = video-list function transformNext(event) { co..

프로젝트를 완성시키기 위해 다시 코드를 짜보려고 한다. 먼저 해결하지 못했던 문제들부터 고친 다음, 부수적인 부분을 발전시켜나가야겠다. 문제 1. 튀어나온 글자 집어 넣기 변경 전 CSS .choreo-info{ font-size: 1.4rem; font-weight: bold; display: flex; max-width: 240px; } 변경 후 CSS .choreo-info{ font-size: 1.4rem; font-weight: bold; display: flex; max-width: 240px; white-space: nowrap; overflow: hidden; } 해결방법 white-space 의 속성을 nowrap으로 설정해 줄바꿈을 하지않고, 크루이름 옆에 안무가의 이름이 나올 수 있도..

5월 1일, 나름 열심히(?) 공부한 것들(!) node.js + express => 웹 서버 구축 웹 서버(Web Server)란? - HTTP를 통해 웹 브라우저에서 요청하는 HTML 문서나 오브젝트(이미지 파일 등)을 전송해주는 서비스 프로그램 1) 소프트웨어 측면 : 웹 브라우저와 같은 클라이언트로부터 HTTP 요청을 받아들이고, HTML 문서와 같은(정적인 컨텐츠 ex) .html .jpeg .css) 웹 페이지를 반환하는 컴퓨터 프로그램 2) 하드웨어 : 웹 서버가 설치되어 있는 컴퓨터 웹 서버(Web Server) 주요 기능 - 웹 페이지를 클라이언트로 전달하는 것 - 주로 그림, CSS, 자바스크립트를 포함한 HTML 문서가 클라이언트로 전달 Express란? - 웹 및 모바일 애플리케이션..

다음으로 해당 아이콘에 js기능을 추가해주려고 한다. 1. 나열된 카드들이 화면 크기를 넘어갈 경우에만 해당 아이콘 표시 2. 왼쪽으로 카드들이 이동 가능할 경우에는 왼쪽 버튼 활성화, 오른쪽으로 이동 가능할 경우에는 오른쪽 버튼 활성화 let videoList = slidePrevList[i].parentElement.parentElement.nextElementSibling; videoList에 ul태그를 담기 위해 앞서 정의한 slidePrevList로부터 ul 태그가 있는 부분을 가리켜야 한다. slidePrevList.parentElement = 빨간색 박스 slidePrevList.parentElement.parentElement = 파란색 박스 slidePrevList.parentElemen..