[해피CGI][cgimall] 마우스로 요소를 회전시키는 JavaScript 라이브러리 Propeller.js

# 설명

Propeller.js 는 마우스를 이용하여 요소를 회전시키는 JavaScript 라이브러리 입니다. 
관성 회전과 단계적 회전을 지원하며, 터치 기기와도 호환 됩니다. 

# 라이센스

MIT License


# 사용방법 

압축파일에 보시면 index.html 파일을 이용하면 바로 작동되는 걸 확인할 수 있습니다. 


# 옵션 설정 

 

- angle: 초기 회전 각도를 설정합니다.
- inertia: 가장 중요한 옵션으로, 0과 1 사이의 숫자로 설정합니다. 0은 마우스를 뗐을 때 회전이 즉시 멈추는 것을 의미하며, 1은 무한히 회전함을 의미합니다. (이 데모에서는 0.99를 사용합니다.)
- speed: 초기 회전 속도입니다. 실행 중(Runtime)에 속도 값을 변경하는 용도로도 사용할 수 있습니다.
- minimalSpeed: 회전의 최소 속도입니다. 관성(inertia) 값이 0에서 1 사이일 때만 작동합니다.
- step: 단계별 회전 모드를 사용할 때, 각도 단위로 단계(step)를 설정합니다.
- stepTransitionTime: 단계와 단계 사이를 이동할 때 CSS 트랜지션(효과)을 활성화합니다. 이를 통해 회전 단계를 부드럽게 만들고 CSS의 easing 효과를 적용할 수 있습니다.
- stepTransitionEasing: 단계별 회전 모드에서 stepTransitionTime이 0보다 클 때 적용되는 CSS easing 모드입니다.
- onRotate: 회전하는 동안 실행되는 콜백 함수입니다. 함수 내부에서 this.angle을 통해 현재 각도를 쉽게 가져올 수 있습니다.
- onStop: 회전이 멈췄을 때 실행되는 콜백 함수입니다.
- onDragStart: 드래그를 시작할 때 실행되는 콜백 함수입니다.
- onDragStop: 드래그를 멈췄을 때 실행되는 콜백 함수입니다.


이미지 변경하면 뽑기 돌림판으로 사용해도 좋을 것 같습니다.