数字平滑前端插件JS&CSS库

最新推荐文章于 2024-08-24 09:45:58 发布

weixin_30593261

最新推荐文章于 2024-08-24 09:45:58 发布

阅读量164

点赞数

CC 4.0 BY-SA版权

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/q1104460935/p/8778404.html

本文介绍如何利用Odometer.js结合jQuery实现网页上动态更新的大数字显示效果，每隔3秒会随机更新一个0到1亿之间的数值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

CDN DEMO 拷贝可用；

<!DOCTYPE html>
<link rel="stylesheet" href="https://cdn.bootcss.com/odometer.js/0.4.8/themes/odometer-theme-car.css" />
<style>
.odometer {
  font-size: 40px;
}
</style>
<script>
window.odometerOptions = {
  format: '(ddd).dd'
};
</script>

<script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/odometer.js/0.4.8/odometer.min.js"></script>
<div class="odometer">99999999</div>

<script>
  setInterval(function(){
      let data = Math.random() * 100000000
    $('.odometer').html(data);
  }, 3000);
</script>