javascript - 基于百分比显示气泡的 Javascript

Question

我需要一个 javascript 来显示结果，该结果以气泡的形式返回为百分比值。气泡大小需要基于百分比值。如果百分比值为 20%，则该气泡的大小应较小，如果为 60%，则该气泡的大小较大。有人可以帮我解决这个问题。谢谢。

Answer 1

试试下面的代码。

<style>

    #circle {

        border: 1px solid red;

        border-radius: 50%;

        -moz-box-sizing: border-box;

        box-sizing: border-box;

        background:pink;
  }

</style>

<div id="circle"> </div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>

    $(function(){

        var maxWidth = 200, // This is the max width of your circle

        percent = 0.7; // This is the percentage value

        $("#circle").css({

            "width" : maxWidth * percent,

            "height" : maxWidth * percent           
        });

    });

</script>