实现数字滚动的效果(领取红包后余额变化的数
digitScroll
实现数字滚动的效果(领取红包后余额变化的数字滚动效果)
效果预览效果预览页面
使用方法 包裹数字的容器设置高度,否则默认 30px 例如 <div class="wrapper">当前余额为<div id="digit-scroll"></div>元</div>
创建一个数字滚动实例,传入容器选择器
const digitInstance = new DigitScroll({container:"#digit-scroll"});
在需要滚动的时候调用 roll 方法
digitInstance.roll(78.48);
注意
装数字的容器是用 flex 布局的,如果要兼容比较低的浏览器版本的话,可以修改一下,把容器的 flex 布局去掉,每个数字的容器用 float:left 即可 即注释
this.container.style.display = "flex";
然后解注释下面这一行
// el.style.float='left';
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。