코딩애플 [코딩애플 JS기초] form 공백검사, input, change이벤트 한 글자 입력할 때마다 발생하는 이벤트 글자 입력 후 focus가 다른 곳으로 이동했을 때(유저의 마우스 커서가 input을 벗어났을 때) 발생하는 이벤트 input과 다르게 한번 입력하기 시작해서 글자를 몇개를 입력하든지 이벤트는 발생하지 않지만 커서를 다른쪽에 두는 순간 발생하고 다시 입력하고 또 커서를 다른쪽에 두면 이벤트가 발생하는 식이다. ==는 느슨한 비교(형 생각하지 않고 비교)... 코딩애플addEventListenerform공백검사자바스크립트changejsinputaddEventListener [코딩애플 JS기초] JS 기초 강의지만 CSS 애니메이션을 배우는 시간! 한쪽으로 이동하거나 없다가 나타나는 비포 애프터 변화요소가 하나인 그런 UI 시작 스타일 만들기 최종 스타일 만들기 원할 때 시작 => 최종으로 변화시키는 코드 만들기 transition 추가 올라가는게 매끄럽지 않아 좀 아쉽긴 하지만 뭔가 있어보인다!!... 로그인하세요애니메이션코딩애플CSSCSS [코딩애플 JS기초] Bootstrap, class 탈부착 위한 toggle함수, querySelector Bootstrap을 통해 html, css작성 시간을 줄일 수 있다. 사용방법은 여기에서 버튼, 리스트 등 원하는 디자인의 코드를 복사해서 붙여넣기 하면 사용 가능 document.getElementsByClassName("list-group")[0]. => html에서 class이름이 list-group인 것 중 0번째 요소 classList.toggle("show") => 그 요소의 cl... 코딩애플toggle함수class탈부착식자바스크립트querySelectorjs부트스트랩class탈부착식 HTML 기초 - 스타일링 거의 모든 태그는 style = "" 라는 속성을 열 수 있다. 안에 스타일 이름 : 스타일 값 형식으로 스타일을 넣어주면 된다. 여러 개를 넣고 싶다면 , 대신 ; 을 넣어주어 나열시켜주면 된다. 자주 사용하는 글자 스타일들 이미지 정렬과 폭 조정 이미지는 width를 많이 사용한다 주로 px 혹은 %로 크기를 조정한다. %는 부모태그의 최대 크기에 맞게 계산하는 방법이다. 이미지를 가운데... html코딩애플html HTML & CSS 기초 - 웹레이아웃 기초 <div> 웹 레이아웃에 기초는 박스를 만드는 것부터 출발한다. 박스는 <div> 태그로 만든다. 박스 디자인(div)에 많이 사용하는 CSS 속성 margin은 바깥 여백 padding은 안쪽 여백 border은 테두리 border-radius는 테두리를 둥글게를 뜻한다. margin 속성은 원하는 방향만 줄 수 있다. top, left, bottom, right 중 원하는 곳에만 여백을 줄 수 있다... html코딩애플CSSCSS 코딩애플_modal 창 켜고 끄기 true 면 모달창이 보이고 false 면 없어지게 하는 states 변수 modal을 만든다. states 변수를 생선한다. 초기에는 안보여야 하므로 false 로 지정한다. 클릭하는 대상에게 가서 onClick 실행 코드를 적어준다. !modal 이라 써서 현재 모달 데이터를 반대로 바꿔주게끔 한다. 값이 true, false 이기에 적용가능한거 같다.... 코딩애플ReactReact 코딩애플_props, 부모의 states 가져다 쓰기 코딩애플ReactReact
[코딩애플 JS기초] form 공백검사, input, change이벤트 한 글자 입력할 때마다 발생하는 이벤트 글자 입력 후 focus가 다른 곳으로 이동했을 때(유저의 마우스 커서가 input을 벗어났을 때) 발생하는 이벤트 input과 다르게 한번 입력하기 시작해서 글자를 몇개를 입력하든지 이벤트는 발생하지 않지만 커서를 다른쪽에 두는 순간 발생하고 다시 입력하고 또 커서를 다른쪽에 두면 이벤트가 발생하는 식이다. ==는 느슨한 비교(형 생각하지 않고 비교)... 코딩애플addEventListenerform공백검사자바스크립트changejsinputaddEventListener [코딩애플 JS기초] JS 기초 강의지만 CSS 애니메이션을 배우는 시간! 한쪽으로 이동하거나 없다가 나타나는 비포 애프터 변화요소가 하나인 그런 UI 시작 스타일 만들기 최종 스타일 만들기 원할 때 시작 => 최종으로 변화시키는 코드 만들기 transition 추가 올라가는게 매끄럽지 않아 좀 아쉽긴 하지만 뭔가 있어보인다!!... 로그인하세요애니메이션코딩애플CSSCSS [코딩애플 JS기초] Bootstrap, class 탈부착 위한 toggle함수, querySelector Bootstrap을 통해 html, css작성 시간을 줄일 수 있다. 사용방법은 여기에서 버튼, 리스트 등 원하는 디자인의 코드를 복사해서 붙여넣기 하면 사용 가능 document.getElementsByClassName("list-group")[0]. => html에서 class이름이 list-group인 것 중 0번째 요소 classList.toggle("show") => 그 요소의 cl... 코딩애플toggle함수class탈부착식자바스크립트querySelectorjs부트스트랩class탈부착식 HTML 기초 - 스타일링 거의 모든 태그는 style = "" 라는 속성을 열 수 있다. 안에 스타일 이름 : 스타일 값 형식으로 스타일을 넣어주면 된다. 여러 개를 넣고 싶다면 , 대신 ; 을 넣어주어 나열시켜주면 된다. 자주 사용하는 글자 스타일들 이미지 정렬과 폭 조정 이미지는 width를 많이 사용한다 주로 px 혹은 %로 크기를 조정한다. %는 부모태그의 최대 크기에 맞게 계산하는 방법이다. 이미지를 가운데... html코딩애플html HTML & CSS 기초 - 웹레이아웃 기초 <div> 웹 레이아웃에 기초는 박스를 만드는 것부터 출발한다. 박스는 <div> 태그로 만든다. 박스 디자인(div)에 많이 사용하는 CSS 속성 margin은 바깥 여백 padding은 안쪽 여백 border은 테두리 border-radius는 테두리를 둥글게를 뜻한다. margin 속성은 원하는 방향만 줄 수 있다. top, left, bottom, right 중 원하는 곳에만 여백을 줄 수 있다... html코딩애플CSSCSS 코딩애플_modal 창 켜고 끄기 true 면 모달창이 보이고 false 면 없어지게 하는 states 변수 modal을 만든다. states 변수를 생선한다. 초기에는 안보여야 하므로 false 로 지정한다. 클릭하는 대상에게 가서 onClick 실행 코드를 적어준다. !modal 이라 써서 현재 모달 데이터를 반대로 바꿔주게끔 한다. 값이 true, false 이기에 적용가능한거 같다.... 코딩애플ReactReact 코딩애플_props, 부모의 states 가져다 쓰기 코딩애플ReactReact