html, css, javascript68 addEventListener 'keydown' 사용법 addEventListener 'keydown' 사용법 설명 addEventListener() 메서드는 요소에 이벤트 핸들러 함수를 등록하는 메서드입니다. keydown 이벤트는 키보드의 키를 누르는 순간 발생하는 이벤트입니다. 코드 사용법 element.addEventListener('keydown', function, useCapture); 입력값 설명 'keydown' 이벤트 이름 'keydown' 그대로 작성 function 이벤트 핸들러 함수 useCapture (optional) 이벤트 캡처링을 사용할지 여부를 지정하는 불리언 값입니다. 기본값은 false입니다. 예시 HTML 삽입 미리보기할 수 없는 소스 2023. 4. 12. css animation 옵션 css animation 옵션 설명 animation-name 애니메이션에 사용할 키프레임을 지정합니다. 키프레임은 애니메이션의 시작과 끝 지점을 정의하는데 사용됩니다. animation-duration 애니메이션의 지속 시간을 지정합니다. 지정된 시간 동안 애니메이션이 실행됩니다. animation-timing-function 애니메이션의 실행 시간을 조절하는 함수를 지정합니다. 지정된 함수에 따라 애니메이션이 가속, 감속, 등속 등으로 실행됩니다. animation-delay 애니메이션이 시작하기 전까지의 대기 시간을 지정합니다. 이 값을 사용하여 애니메이션 실행 시점을 조절할 수 있습니다. animation-iteration-count 애니메이션의 반복 횟수를 지정합니다. 이 값을 사용하여 애니메이.. 2023. 4. 11. 두가지 이미지 번갈아가며 나타내기 css 두가지 이미지 번갈아가며 나타내기 css HTML 삽입 미리보기할 수 없는 소스 [참고] css animation 옵션 https://noanomal.tistory.com/179 animation-name 애니메이션에 사용할 키프레임을 지정합니다. 키프레임은 애니메이션의 시작과 끝 지점을 정의하는데 사용됩니다. animation-duration 애니메이션의 지속 시간을 지정합니다. 지정된 시간 동안 애니메이션이 실행됩니다. animation-timing-function 애니메이션의 실행 시간을 조절하는 함수를 지정합니다. 지정된 함수에 따라 애니메이션이 가속, 감속, 등속 등으로 실행됩니다. animation-delay 애니메이션이 시작하기 전까지의 대기 시간을 지정합니다. 이 값을 사용하여 애니메이션 .. 2023. 4. 11. html div 선그리기, div draw line html div 선그리기, div draw line HTML 삽입 미리보기할 수 없는 소스 2023. 4. 11. 공 튀기기 css / bounding ball css 공을 튀기는 css 코드는 아래와 같습니다. animation과 @keyframe 을 이용하여 움직임효과를 주었습니다. HTML 삽입 미리보기할 수 없는 소스 [참고로] border-radius를 이용하여 원 그리기 위한 코드는 아래와 같습니다! HTML 삽입 미리보기할 수 없는 소스 2023. 4. 9. ul, li 바둑판 grid/ ul, li 그리드 / grid-template-columns ul, li 바둑판 grid/ ul, li 그리드 컬럼이 5개 한컬럼단 폭인 200px인 그리드 코드 예시는 아래와 같습니다. HTML 삽입 미리보기할 수 없는 소스 2023. 4. 6. 이전 1 ··· 5 6 7 8 9 10 11 12 다음
