본문 바로가기

Webstoryboy

Category

Explanation

animation

(7)
classList.remove() classList.remove() classList.remove() 메서드는 선택한 요소한테 클래스 이름을 삭제합니다. classList는 읽기 전용 속성이며, add(), remove(), toggle(), replace() 메서드를 추가하여 사용할 수 있습니다. classList.remove() classList.remove() 메서드는 선택한 요소한테 클래스 이름을 삭제합니다. 특징 설명 버전(version) ES1 결과값(return) 클래스 삭제 사용성 ★★★★★ 문법(Syntax) "선택자".classList.remove("클래스 이름") "선택자".classList.remove("클래스 이름", "클래스 이름",....) //클래스 이름을 추가하는 경우 documemt.querySelecto..
animation-play-state animation-play-state animation-play-state 속성은 애니메이션 진행상태를 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation-play-state animation-play-state 속성은 애니메이션 진행상태를 설정합니다. 특징 설명 기본 값 animation-play-state : running; 적용 animation 버전 CSS3 사용성 ★★★★☆ 정의(Definition) animation-play-state 속성은 애니메이션 진행상태를 설정합니다. 애니메이션과 관련된 속성(..
animation-fill-mode animation-fill-mode animation-fill-mode 속성은 애니메이션이 끝난 후의 상태를 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation-fill-mode animation-fill-mode 속성은 애니메이션이 끝난 후의 상태를 설정합니다. 특징 설명 기본 값 animation-fill-mode : none 적용 animation 버전 CSS3 사용성 ★★☆☆☆ 정의(Definition) animation-fill-mode 속성은 애니메이션이 끝난 후의 상태를 설정합니다. 애니메이션과 관련..
animation-duration animation-duration animation-duration 속성은 애니메이션 움직임 시간을 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation-duration animation-duration 속성은 애니메이션 움직임 시간을 설정합니다. 특징 설명 기본 값 animation-duration : 0s; 적용 animation 버전 CSS3 사용성 ★★★★★ 정의(Definition) animation-duration 속성은 애니메이션 움직임 시간을 설정합니다. animation-duration 속성에는 시..
animation-direction animation-direction animation-direction 속성은 애니메이션 움직임 방향을 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation-direction animation-direction 속성은 애니메이션 움직임 방향을 설정합니다. 특징 설명 기본 값 animation-direction : normal; 적용 animation 버전 CSS3 사용성 ★★★☆☆ 정의(Definition) animation-direction 속성은 애니메이션 움직임 방향을 설정합니다. animation-direc..
animation-delay animation-delay animation-delay 속성은 애니메이션 지연 시간을 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation-delay animation-delay 속성은 애니메이션 지연 시간을 설정합니다. 특징 설명 기본 값 animation-delay: 0s; 적용 animation 버전 CSS3 사용성 ★★★★★ 정의(Definition) animation-delay 속성은 애니메이션 지연 시간을 설정합니다. 애니메이션과 관련된 속성(Animation Related Properties) ani..
animation animation animation 속성은 애니메이션과 관련된 속성을 일괄적으로 설정합니다. 애니메이션은 움직임 시간, 움직임 지연 시간, 움직임 방향, 움직임 속도, 움직임 진행상태, 움직임 반복 횟수, 움직임 진행상태, 움직임 속도, 키프레임 이름 등을 설정하여 원하는 애니메이션을 구현 할 수 있습니다. animation animation 속성은 애니메이션과 관련된 속성을 일괄적으로 설정합니다. 특징 설명 기본 값 animation-name: none; animation-duration: 0s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-direction: normal; ani..
1