jQuery动画进度条问题

Question

我有一个小的jQuery问题，基本上我正在尝试构建一个进度条，在1-2秒的时间内从0加载到给定的百分比。

根据教程JSFiddle

查看我到目前为止所得到的内容

小提琴不会动画它，但让我描述实际发生的事情（显然它确实对我的测试文件起作用）。

因此进度条会按照假设加载，但会停止在html中给“title =”的值。它不会接受百分比，所以如果设置的宽度是460，为了使条形停止在50％，我必须给它一个230的值。

关于这个脚本的另一个问题是只有第一个条实际上取实际值，所有其他的只是“复制”第一个，无论赋予它们的值。对我来说很奇怪。

我要么找一种方法来解决这两个问题，要么是一种更好的方法来达到预期的效果，最好用百分比输入而不是像素值。

感谢。

Answer 1

http://jsfiddle.net/mWdgz/4/

$("document").ready(function () {

    // animate the progress bar onload

    $('.progress_bar').each(function () {
        $(this).animate({
            width: this.title
        }, 1000);
    })

});