웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall]선으로 진행률 표시 JQuery 플러그인 - rProgressbar 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall]선으로 진행률 표시 JQuery 플러그인 - rProgressbar

해피CGI윤실장 2022. 3. 22. 09:15

- 라이센스

MIT



- 사용 방법


1. 파일 상단에 Jquery 라이브러리와 jQuery.rProgressbar.min.js 파일을 로드합니다.






2. jQuery Waypoints 플러그인을 로드하여 진행률을 표시할때 애니메이션을 실행할 수 있습니다. (선택사항)

- Waypoints 플러그인

https://github.com/imakewebthings/waypoints






3. 표시할 퍼센테이지를 설정하여 rProgressbar 플러그인을 호출합니다.






4. Waypoints를 비활성화하려면 소스 코드를 약간 변경해야 합니다.






5. 진행률 표시 선의 모양을 사용자가 지정할 수 있습니다.

  • 채우기 색상
  • 배경색
  • 경계 반경
  • 바 높이
  • 바 너비

 






6. 퍼센테이지를 함께 표시할지 여부를 설정할 수 있습니다. (기본값 : true)






7. 애니메이션 지속 시간을 지정할 수 있습니다. (기본값 : 1000ms)











- 작동 예제




Comments