JavaScript 기반 진행률 표시 줄

Question

JavaScript (또는 jQuery의 혜택) 기반 진행 지표가 어떻게 개발 될 수 있는지 궁금합니다.

Alt Text http://img707.imageshack.us/img707/3295/dealindicator.png

내 첫 번째 아이디어는 다음과 같은 것입니다.

function drawBar(total,sofar){
.........................

}

여기서 최대 번호 (우리의 경우 20)와 Sofar (사진의 경우 15)를 소비합니다.

그러나 어떻게 구현할 수 있습니까?

이를 달성하기위한 jQuery 기반 플러그인이 있습니까?

문안 인사

Answer 1

이것은 일반적으로 CSS로 수행됩니다. div ProgressBar의 총 크기, 그리고 다른 사람이 있습니다. div 채워야 할 금액의 비율이 높은 아이.

당신은 스타일을 만들 수 있습니다 div어쨌든 당신은 원합니다. 당신은 내면의 div를 스타일링하고 싶을 것입니다 background-color, 또는 background-image & background-repeat. 단색, 그라디언트 또는 밴드 패턴 일 수 있으며, 이는 다소 인기있는 것처럼 보입니다.

jQuery 플러그인을위한 Google이 있습니까? 그들은 찾기가 매우 쉽습니다. 예를 들면 다음과 같습니다. http://t.wits.sg/jquery-progress-bar/