본문 바로가기
반응형

🖥️ 프로젝트?8

🎚️ Your Score : 슬라이더와 카운터 연습 요약 📙 프로젝트명 : Your Score ⚙️ 주요 기능 : 슬라이더와 숫자를 조정가능한 카운터가 있음 🚩 목적 : 슬라이더와 카운터 연습, 뉴모피즘 스타일 📆 제작 기한 : 2023년 1월 18일 ~ 1월 20일 (3일간) 🛠️ 사용 툴 : HTML, CSS, JavaScript 🔗 GitHub 링크 : https://github.com/dobbyjang0/javascript-mini-project/tree/main/your-score 기능설명 위쪽의 슬라이더는 Thumb를 움직일 경우 위에 버블이 생겨 값을 알려준다. 동작이 끊나고 다른 요소를 건드리면 해당 버블은 사라진다. 아래쪽의 카운터는 왼쪽 버튼을 누르면 숫자가 내려가고, 오른쪽 버튼을 누르면 숫자가 올라간다. 어려웠던 점 / 배웠던 점 슬.. 2023. 1. 21.
🎯 Change Color : 랜덤 색상 띄우기 요약 📙 프로젝트명 : Change Color ⚙️ 주요 기능 : 가운데 버튼을 누르면 랜덤한 색상의 동심원이 생기고 버튼의 문구가 바뀜 🚩 목적 : CSS, Javascript, 문서화 연습 🛠️ 사용 툴 : HTML, CSS, JavaScript 🔗 GitHub 링크 : https://github.com/dobbyjang0/javascript-mini-project/tree/main/random-color 기능 설명 가운데 'Change xxx'라 적힌 버튼을 누르면 중앙에서 랜덤한 색상의 원이 하나 생성된다. 해당 원은 3초간 커지며 화면을 덮은 후, 사라지고 동시에 배경색이 해당 색으로 대체된다. 또 버튼을 누를 때 버튼의 단어가 목록의 랜덤한 단어 중 하나로 바뀐다. 어려웠던 점 / 배웠던 점 .. 2023. 1. 18.
반응형