본문 바로가기

Effect/Game Effect3

게임 효과 - 테트리스 게임 게임 이펙트 - 테트리스 게임 지금까지 배운 css, javascript 지식을 총 출동하여 간단한 게임을 만들어 봅니다. > 사이트 미리보기 원본 소스 보기 자바스크립트 작성한 자바스크립트 코드입니다. 오류도 있고 아직 미흡한 부분이 많지만 귀엽게 봐주세요^0^ const tetrisWrap = document.querySelector(".tetris__wrap"); const playground = tetrisWrap.querySelector(".playground > ul"); const tetrisStart = tetrisWrap.querySelector(".tetris__start"); const startBtn = tetrisWrap.querySelector(".start__btn"); con.. 2022. 11. 9.
게임 효과 - 카드 짝 맞추기 게임 이펙트 - 카드 맞추기 게임 지금까지 배운 css, javascript 지식을 총 출동하여 간단한 게임을 만들어 봅니다. > 사이트 미리보기 원본 소스 보기 자바스크립트 작성한 자바스크립트 코드입니다. 오류도 있고 아직 미흡한 부분이 많지만 귀엽게 봐주세요^0^ // 01 HTML/CSS 디자인 구성 // 02 클릭한카드 뒤집기 // 03 두개의 카드 뒤집고 확인하기(첫번째카드, 두번째카드) // 선택자 만들기 const memoryWrap = document.querySelector(".memory__wrap"); //메모리 게임 가장 큰 부모박스 const memoryCard = document.querySelector(".memory__card"); // 각각의 카드가 담긴 부모박스 const.. 2022. 10. 28.
게임 효과 - 음악 플레이어 게임 이펙트 - 음악 플레이어 지금까지 배운 css, javascript 지식을 총 출동하여 간단한 게임을 만들어 봅니다. > 사이트 미리보기 원본 소스 보기 자바스크립트 1. 먼저, 오디오에 대한 정보를 배열 속 객체 형식으로 저장합니다. 2. 그리고 오디오, 클릭 이벤트를 발생시킬 버튼, html요소를 작성할 부분 등을 선택하는 선택자를 작성합니다. 3. 오디오에 대한 정보를 반복문과 변수를 통해 작성합니다. 4. 오디오의 재생, 반복 등에 대한 스크립트를 작성합니다. const allMusic = [ { name: "Robots and Aliens", artist: "Joel Cummins", img: "music_img10", audio: "music_audio10" }, { name: "Glas.. 2022. 10. 20.
728x90

HTML이 적힌 썸네일 이미지
CSS가 적힌 썸네일 이미지
JAVASCRIPT가 적힌 썸네일 이미지

JAVASCRIPT

자세히 보기