0

I made this simple html snippet: <div class="progress-bar"></div>, then I styled it: 

.progress-bar {
    background-color: #DFDFDF;
    height: 24px;
    margin-bottom: 6.66667px;
    margin-left: -2px;
    margin-top: -22px;
    z-index: 1;
}

Additionally:

<li>
<span class="name">
<a>theme</a>
</span>
<span class="value"> <?=$howtsrg?></span>
<div class="progress-bar"></div>
</li>

<?=$howtsrg?> = the value feteched from the database

Now, I want to give this progressbar a width, but this has to be automatically, depending on the value that is been fetched from the database. For example, I now have a list with a value 7 and a value 2... I want to have a different width of the progressbar, because they do not have the same value. How can I make this work? I couldn't find a relevant jQuery script.

PS: the list values are dynamic and will change as days go past! So 7 and 2 can be 15 and 22!

4

2 に答える 2

1

このようにしてください。のような値があるとします72。jQuery を使用して、次の方法で実行できます。

$(".progress-bar").css("width", "75%");

または、次の方法で実行できます。

$(".progress-bar").width("75%");

与える必要がありますpx: 幅を変更:<?=$howtsrg?>px;

于 2012-10-04T07:49:55.473 に答える
0

パーセンテージを使用できます：

$('.progress-bar').width('50%');

個々の進行状況バーをターゲットにするには、それらに を与えるidか、適切なセレクターで選択する必要があります。

于 2012-10-04T07:49:59.323 に答える