Vanilla JS9 Vanilla JS. D-day calculator (feat. flexible) * 저번에 배운 고정된 날짜 값에 대한 디데이 계산을 토대로 입력 값에 대한 디데이 계산기를 만들어보았다. 디데이 계산기 // 계산된 디데이 값이 나오기 전까지 안보이게 .hidden { display: none; } * 계산된 디데이 값이 나오기 전까지 안보이게 클래스값을 줘서 css display로 출력이 안되게 숨겨두었다. const main = document.querySelector("#main"); const title = document.querySelector(".title") const select = document.querySelector(".select"); function mainHandle(event) { const Hidden = "hidden"; event.preventDef.. 2023. 1. 13. Vanilla JS. D-day(feat. fixed) * 노마드코더 강의를 보고 만든 고정된 날짜 값에 대한 디데이를 만들었다가, 고정된 값이 아닌 입력값을 기반으로 만들어 보면 어떨까해서 유동적으로 입력값을 넣으면 계산되는 디데이 계산기도 만들어 보았다.(이건 다음 시간에) * 오늘은 고정된 값에 대한 것만 업로드. 2023 크리스마스 const clock = document.querySelector("#clock"); function Dday() { const target = new Date("2023-12-25"); // 고정된 날짜 값 const today = new Date(); // 현재 시간 const diff = target - today; const d = Math.floor(diff / (1000*60*60*24)); /* 처음 봤을 때 .. 2023. 1. 10. Vanilla JS. select box (feat. link)_수정 * 드롭다운 메뉴를 만들려다가 현실에 타협하고 셀렉트 박스를 만들어봤습니다. (조만간에 다시 도전) =Select Link= 네이버 구글 유튜브 const select = document.querySelector(".select"); /* function selectLink() { const selectLink = document.querySelector(".select"); window.open(selectLink.value); } */ //이게 기존이었는데, 생각해보니까 전연변수에 select를 선언해놨는데 따로 만들 필요가 없었네요. function selectLink() { window.open(select.value); } select.addEventListener("change", select.. 2023. 1. 9. Vanilla JS. modal * 노마드코더 영상을 참고하여 만들었습니다. 열기 I'm a modal ❌ const openModal = document.querySelector("#btn"); const modal = document.querySelector(".modal"); const overLay = modal.querySelector(".modal_overlay"); const close = modal.querySelector("button"); function openHandle() { modal.classList.remove("hidden"); } function closeHandle() { modal.classList.add("hidden"); } // const openHandle = () => { // modal.c.. 2023. 1. 7. 이전 1 2 3 다음
