@ccactuss

Как сделать process bar з длиной больше чем 100?

Сделала process bar , но хочу сделать диапазон больше 100, т.к. будут использоваться значения 30000 и больше.

По сути все считаеться по фромуле $this.css("width", per + '%');, но может есть другой способ заполнить шкалу.

Jquery
$('.Number__two').each(function () {
    var $this = $(this);
    var per = $this.attr('per');
    $this.css("width", per + '%');
    $({ animatedValue: 0 }).animate({ animatedValue: per }, {
        duration: 1000,
        step: function () {
            $this.attr('per', Math.floor(this.animatedValue));
        },
        complete: function () {
            $this.attr('per', Math.floor(this.animatedValue));
        }
    });
});


HTML:
<div class="col-xl-6">
                    <div class="detail__value">
                        <div class="bl_text">
                            <p>3DMark Ice Storm GPU</p>
                        </div>
                        <div class="value">
                            <div class="Number__lineChart">
                                <div class="Number__two" per='30'></div>
                            </div>
                        </div>
                    </div>
                </div>
  • Вопрос задан
  • 68 просмотров
Решения вопроса 1
Seasle
@Seasle Куратор тега CSS
Помог - отметь решением \( ゚ヮ゚)/
Если у Вас имеется максимально возможно значение, то Вы можете рассчитать процент по формуле (now / total) * 100:
function calculatePercent(value, max) {
    return (value / max) * 100;
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы