jQuery 数字递增动画实现 - 简单易懂的代码示例

您可以使用jQuery的animate()函数来实现数字递增的动画效果。下面是一个简单的示例：\n\nHTML代码：\n\nhtml\n<span id="count">0</span>\n\n\njQuery代码：\n\njavascript\nfunction countAnimation(target, duration) {\n $({ countNum: 0 }).animate({ countNum: target }, {\n duration: duration,\n easing: 'linear',\n step: function() {\n $('#count').text(Math.floor(this.countNum));\n },\n complete: function() {\n $('#count').text(target);\n }\n });\n}\n\ncountAnimation(100, 2000); // 从0递增到100，持续时间2秒\n\n\n在上面的代码中，我们定义了一个名为countAnimation()的函数，它接受两个参数：目标值target和动画持续时间duration。函数内部使用animate()函数来递增计数值，并在每次变化时更新显示的数字。在动画结束时，我们将最终的目标值设置为显示的数字。\n\n您可以根据实际需求调整函数中的参数，例如目标值、持续时间和easing函数等。