본문 바로가기
728x90
반응형

☭DEVELOPER/#2 웹개발(자바기반 풀스택)214

[JAVASCRIPT]선택문(Switch-case) 선택문(Switch-case) 들어오는 변수값이 무엇이냐에 따라 선택해주고 실행하는것 정해져있는 값들을 선택할 때 좋다. 선택문(Switch-case) let 변수; switch(변수){ case 값1 : 실행문1; break; case 값2 : 실행문2; break; case 값3 : 실행문3; break; default : 실행문; } let url에서 작성한 url로 들어갈 수 있는 명령어 if(url){ location.href = url; } 반복문(while) 조건이 만족할 때까지 반복한다. while(조건){ 참; i++; i--; } 조건 : i 2023. 7. 19.
비주얼 스튜디오 코드 80_ 마우스 오버 효과_제이쿼리 html mark up reset css 지정 client: 브라우저 기준으로 잡아주는 마우스 offset: 마우스가 특정 구역에 들어가면 마우스 형태가 바뀜 page:전체 페이지 잡아줄 때 사용 screen:모니터가 기준(0,0) .info css edit ● max-width: 70vw 가장 큰 사이즈 화면에서 70vw를 사용하겠다. cursor 만들기 /* 기준점이 따로 없다 */ .cursor{ position: absolute; top: 100px; left: 100px; width: 50px; height: 50px; border: 3px solid #fff; background-color: rgba(255, 255, 255, 0.3); border-radius: 50%; /* 가장 위에 오도.. 2023. 7. 18.
비주얼 스튜디오 코드 79_뮤직 플레이어 3 section이 회전을 해야한다. section에 시간을 줘야 움직이는게 보임 넥스트 버튼을 눌렀을 때 오른쪽에 있는 씨디가 2번, 왼쪽 씨디가 8번째이다. 기준점에서 10vw만큼 떨어져있음 script 제이쿼리는 css, 자바스크립트 style n = 0 변수 지정해준다. n++는 오른쪽 으로 회전 , n--는 왼쪽회전 rotate {n * deg = 0 * 45} deg 45도씩 증감하여 회전한다. 버튼을 누르면 section이 회전한다. 함수지정 on을 갖고 있는 액티브 값을 0으로 변수 지정 0-7번까지 인덱스 번호가 돌아갈 것이다. 회전하면서 8개의 on을 제거할 것이다. index에 들어가있는 번호(선택되어있는 번호)만 on을 넣어줄 것이다. length-1을 넣어 0부터 시작하도록한다. ●함.. 2023. 7. 18.
[JAVASCRIPT]if 조건 조건문1 if 조건 { 참 } else{ 거짓 } 값 출력 > document.write() 1000은 어떤 타입인지 보기 1000은 문자이다. promt("당신의~")에서 출력값을 ""로 넣었기 때문에 let mount = prompt("당신의 하루 걷는 양은 몇보인가요?",""); 1000을 숫자로 변경하기 let Nmount = Number(mount); 문자, 숫자를 구분해서 조건을 제대로 넣어주어야한다. 문자는 문자와, 숫자는 숫자와 비교해야한다. if문 작성 조건문 2 0값일 경우에만 거짓이다. 0은 거짓이고 1은 참이다 그 외에는 다 참임 두 가지 방법이 있다. document.write(userName+"님을 만나서 반갑습니다.") document.write(`${userName}님을 만나.. 2023. 7. 18.
비주얼 스튜디오 코드 78_ 뮤직플레이어 2 .play css edit CD 돌아가는 효과넣기 .pic after 가상요소에 애니메이션을 준다. script 기존에 만들었던 el list에 스크립트를 추가한다. play라고 변수 지정 ● target: 선택된 객체, target은 오류가 있을 수 있다. ● currentTarget: 오류를 줄이기 위해서 추가된 태그. 이벤트를 갖고있는 아이가 선택되면 이벤트가 실행 간혹 선택되는 아이는 다른아인데 실행되는 아이가 다를 수 있다. 그러한 오류를 방지하기 위해 currentTarget을 사용 ●tagName: 태그 네임을 가지고 와라 ● closest : 상위 부모를 찾음 ●classList: =addclass 플레이 버튼을 누르면 시디가 돌아간다. 그림자도 같이 돌리기 pause 누를 시에 CD 멈추.. 2023. 7. 17.
[JAVACRIPT]document.write / Data Type doucument.write 로 연산자를 구할 수 있다. document.write : 윈도우에 직접 출력됨 숫자를 입력하면 30이 화면에 출력됨 console.log 확인용 confirm 컨펌용 변수 세개를 만듦 변수 세개를 출력하는 방법 변수들이 한 줄로 나열되어있다. 나열된 변수들을 행바꿈으로 변경해주기 : enter 태그는 반드시 따옴표 안에 작성해야한다, ● typeof: 문자의 타입을 알려주는 태그 boolean: 참, 거짓 string: 문자 Data Type number 1e+2 : 10의 2승 string 큰따옴표안에 있을 경우 무조건 문자로 인식함 큰따옴표 안에 외따옴표 외따옴표 안에 큰따옴표로 구분을 해주어야 오류가 안난다. 큰 따옴표안에 10이 들어가지만 문자로 인식한다. 키보드의 .. 2023. 7. 17.
728x90