ProgressBar.js를 사용하여 반응 형 진행 바 생성
진행률 표시 줄 대부분의 사용자는 웹에서 널리 알려져 있습니다. 개발자의 경우 종종 복잡한 프로세스가 필요합니다. 처음부터 진행률 표시 줄 만들기. 하지만 함께 ProgressBar.js 너는 할 필요 없어.!
이 무료 오픈 소스 라이브러리 의존성이 없다. 과 모든 주요 브라우저를 지원합니다., IE9 포함+.
기본적으로 간단한 술집 사용, 또는 당신은 할 수있다. 몇 가지 기본 도형 중에서 선택하십시오., 예 :
- 한 줄
- 반원
- 전체 서클
- 광장
- 삼각형
또한 디자인 할 수 있습니다. 나만의 맞춤형 심장, 구름 또는 웹 사이트 로고의 글자 표시 등. 이것은 약간의 노력이 필요 하겠지만 최종 결과는 믿을 수 없을 것입니다..
도서관 SVG 경로에서 작동합니다., 그렇게 할 수 있다면 윤곽선을 그렸다. SVG 마크 업을 사용하여 그것을 움직이십시오 이 진행률 표시 줄 라이브러리로.
애니메이션도 가능합니다. 텍스트 포함 또는 커스텀 시작 / 정지 패턴을 갖는다.. 전체 API가 있습니다. 옵션 / 콜백에 대한 자세한 정보 너가 너의 여가에서 정독 할 수있는.
ProgressBar.js에는 작은 크기도 있습니다. 설치 설명서 당신이 할 수있는 곳 스크립트 다운로드 및 설정 Bower, npm 또는보다 단순화 된 GitHub 페이지 사용.
그리고 시원한 것을 만들면 할 수 있습니다. GitHub 저장소에 코드 제출. 프로젝트의 창시자 인 Kimmo Brunfeldt는 GitHub 문제를 엽니 다. 당신이 할 수있는 곳 맞춤 디자인 제출 도서관에 포함시키다.
너는 할 수있다. 애니메이션 진행률 막대 추가 가입 페이지, 업로드 필드 또는 프리 로더로 모든 웹 페이지. 옵션은 얼마나 자세하게 너는 기꺼이.
예를 들어, 비밀번호 강도 측정기 데모가 마음에 듭니다. 진짜 목적으로 봉사하다 과 사용자 경험에 도움이된다.. 이 예가 나온다. 플러그인과 함께 포장 된, 그래서 이것을 복사하여 원하는대로 수정할 수 있습니다..
보다 더 많은 예제, ProgressBar.js 홈페이지를 확인하거나 심장 애니메이션을 데모하는이 바이올린을 들여다보세요..