计算资金温度计

Question

我使用了CodePen (https://codepen.io/developer007/pen/NNdBQw?page=3)的一个例子，我已经把它变成了一个水平温度计。

然而，当我试图计算javascript文件中的数学语句时，我被难住了。我想有一个111,000美元的目标，但目前的文件只计算到1000。

我也不能使进度与进度条对齐...

 // JavaScript Document
 function thermometer(goalAmount, progressAmount, animate) {
 "use strict";
 var $thermo = $("#thermometer"),
    $progress = $(".progress", $thermo),
    $goal = $(".goal", $thermo),
    percentageAmount;

 goalAmount = goalAmount || parseFloat($goal.text()),
 progressAmount = progressAmount || parseFloat($progress.text()),
 percentageAmount = Math.min(Math.round(progressAmount / goalAmount * 
 1000) / 10, 100); //make sure we have 1 decimal point

 $goal.find(".amount").text();
 $progress.find(".amount").text();

 $progress.find(".amount").hide();
 if (animate !== false) {
    $progress.animate({
        "width": percentageAmount + "%"
    }, 1200, function () {
        $(this).find(".amount").fadeIn(200);
    });
 } else {
    $progress.css({
        "width": percentageAmount + "%"
    });
    $progress.find(".amount").fadeIn(200);
 }
 }

 $(document).ready(function () {

 thermometer();

 });

有什么想法吗？

Answer 1

您只需将传递给JQuery函数的值更改为所需的目标量和进度。例如:我将目标移动到111,000美元，并在这里将进度设置为69908美元。

<div id="thermometer">
            <div class="track">
                <div class="goal">
                    <div class="amount" id="goalAmount">111000$</div>
                </div>
                <div class="progress"">
                    <div style="display: block;" class="amount" id="progessAmount">69908$</div>
                </div>
        <div class="bulb"><div class="inner-bulb"></div></div>
            </div>
        </div>

https://codepen.io/anon/pen/bvzmbm?page=3