웹 공부중... 내 코딩 정리노트

const quizCategory = document.querySelector(".quiz__category") //퀴즈 종류 const quizNumber = document.querySelector(".quiz__number") //퀴즈 번호 const quizAsk = document.querySelector(".quiz__ask") //퀴즈 질문 const quizConfirm = document.querySelector(".quiz__confirm") //정답 확인 버튼 const quizResult = document.querySelector(".quiz__result") //정답 결과 const quizView = document.querySelector(".quiz__view") //강아지..

const quizCategory = document.querySelector(".quiz__category") //퀴즈 종류 const quizNumber = document.querySelector(".quiz__number") //퀴즈 번호 const quizAsk = document.querySelector(".quiz__ask") //퀴즈 질문 const quizConfirm = document.querySelector(".quiz__confirm") //정답 확인 버튼 const quizResult = document.querySelector(".quiz__result") //정답 결과 const quizDog = document.querySelector(".quiz__view .dog") /..

hljs.highlightAll(); modal(); tabMenu(); //slider06 const sliderWrap = document.querySelector(".slider_wrap") //전체 const sliderImg = document.querySelector(".slider_img") //이미지 (한칸만) 보이는 영역 const sliderInner = document.querySelector(".slider_inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") //5개의 이미지 저장 console.log(slider): 5개 저장한 이미지 확인 가능 const sliderBtn = document.quer..

hljs.highlightAll(); modal(); tabMenu(); //slider05 const sliderWrap = document.querySelector(".slider_wrap") //전체 const sliderImg = document.querySelector(".slider_img") //이미지 (한칸만) 보이는 영역 const sliderInner = document.querySelector(".slider_inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") //5개의 이미지 저장 console.log(slider): 5개 저장한 이미지 확인 가능 const sliderBtn = document.quer..

hljs.highlightAll(); modal(); tabMenu(); //slider03 const sliderWrap = document.querySelector(".slider_wrap") //전체 const sliderImg = document.querySelector(".slider_img") //이미지 (한칸만) 보이는 영역 const sliderInner = document.querySelector(".slider_inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") //5개의 이미지 저장 console.log(slider): 5개 저장한 이미지 확인 가능 //.slider__inner > div:first-ch..

//slider02 const sliderWrap = document.querySelector(".slider_wrap") //전체 const sliderImg = document.querySelector(".slider_img") //이미지 (한칸만) 보이는 영역 const sliderInner = document.querySelector(".slider_inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") //5개의 이미지 저장 console.log(slider): 5개 저장한 이미지 확인 가능 let currentIndex = -1; //첫번째 이미지(현재 보이는 이미지) let sliderCount = slider.le..

hljs.highlightAll(); modal(); tabMenu(); //slider01 //겹쳐진 이미지를 opacity(불투명도 조절)을 이용해서 차례대로 보여주기 //앞에 이미지들이 0이 되어야 뒤에 이미지가 보임 //변수 설정 : 선택하기 const sliderWrap = document.querySelectorAll(".slider_wrap") //전체 const sliderImg = document.querySelectorAll(".slider_img") //이미지 묶음 | 요소: 이미지1....이미지5 const slider = document.querySelectorAll(".slider") //이미지 let currentIndex = 0; //현재 보이는 이미지 let sliderCo..

//데이터를 변수(명)에 저장 const cssProperty = [ //CSS 속성 목록 //a {num:1, name:"all", desc:"all 속성은 CSS 속성을 재설정하는데 사용할 수 있는 약식 속성입니다."}, {num:2, name:"animation", desc:"animation 속성은 애니메이션 속성을 설정하기 위한 약식 속성입니다."}, {num:3, name:"animation-delay", desc:"animation-delay 속성은 애니메이션이 시작되는 시간을 설정합니다."}, {num:4, name:"animation-direction", desc:"animation-direction 속성은 애니메이션이 움직이는 방향을 설정합니다."}, {num:5, name:"anima..