본문 바로가기

✏️ 공부/JavaScript21

캐러셀 슬라이드(근데 이제 translate 를 곁들인) * 공부 및 자격증을 위해 작성하는 글입니다. * 부족한 내용이나 틀린 내용을 알려주시면 감사합니다. * 코딩애플 js 강의를 참고하여 기능을 연습했습니다. 예전에 margin-left를 이용한 슬라이드(캐러셀)을 배운적이 있었다. 그런데 translate를 이용해야 애니메이션 기능을 만들때 더욱 부드럽게 작용한다고 한다. 실제로 이번에 다시 기능 복습하면서 캐러셀을 margin-left를 사용해서 만들었었는데 PC에선 괜찮았지만 모바일에서는 '다음' 버튼을 처음 화면에서 누를 때마다 캐러셀 넘김이 뚝뚝 끊겼다. translate로 다시 만드니 이 부분은 해결됐다. 2022. 4. 16.
비밀번호 보이기/감추기 기능 * 공부 및 자격증을 위해 작성하는 글입니다. * 부족한 내용이나 틀린 내용을 알려주시면 감사합니다. * 코딩애플 js 강의를 참고하여 기능을 연습했습니다. 공부한 것: 조건문으로 클릭 횟수의 홀짝 횟수를 변수에 받아서 다크모드/라이트모드 전환하는 것을 배웠고 그것을 조금 응용해서 비밀번호 보이기/감추기 기능을 연습해봤다. 비밀번호를 입력한 뒤 'show' 버튼을 누르면 암호로 되어있던 문자가 읽을 수 있는 문자로 바뀐다. (그리고 로그인 하면 비밀의 공간으로 이동함) 2022. 4. 16.
click me-! * 공부 및 자격증을 위해 작성하는 글입니다. * 부족한 내용이나 틀린 내용을 알려주시면 감사합니다. * 코딩애플 js 강의를 참고하여 기능을 연습했습니다. HTML 삽입 미리보기할 수 없는 소스 코드 이제 내가 바뀌어볼게 click me-! 2022. 4. 5.
[JS] 반복문 제어(break 문, continue 문) break 문 지난 for 문과 while 문의 포스팅에서 무한루프에 대한 것을 아주 살짝 다뤘는데 이 break 문을 통해서 제어할 수 있다. // for문에서 break; 사용하기 for(i = 0; i < 5; i++){ if(i === 2){ break; } document.write("when do you stop?_" + i + " "); } // 출력결과 // when do you stop?_0 // when do you stop?_1 변수 i에 0이 담겨있을 때, for 문의 조건이 true니까 그 안의 if 문이 실행된다. for 문 안의 if 문은 i에 담긴 값이 2일 때만 실행되기 때문에 if문을 빠져나와 다음 문장이 실행된다. 그리고 i에 2가 담기는 시점에서는 if 문이 true가.. 2022. 2. 13.