Jquery-animateNumber数字动画插件

数字过渡 数字动画 数字 animate 数字递增 数字递加


实例一、基础动画


//html代码，下面例子相同。
<p>This plugin only <span id="lines">0</span> lines of code.</p>
//JS 代码，请把代码放入script标签内，下面例子相同
$('#lines').animateNumber({ number: 165 });


 


实例二、数字间显示分隔符


<p>World population is <span id="world-population">0</span>.</p>
var comma_separator_number_step = $.animateNumber.numberStepFactories.separator(',')
$('#world-population').animateNumber(
  {
    number: 7095217980,
    numberStep: comma_separator_number_step
  }
);


 


实例三、使用多个属性控制动画


<p>Fun level <span id="fun-level" style="color: red;">0 %</span>.<