javascript - 滚动上的动画计数器
问题描述
所以,我在 Scroll 上找到了这支很酷的钢笔Creative Animated Counter,但我想知道如何格式化数字,以便在超过一千个时使用逗号。
function visible(partial) {
var $t = partial,
$w = jQuery(window),
viewTop = $w.scrollTop(),
viewBottom = viewTop + $w.height(),
_top = $t.offset().top,
_bottom = _top + $t.height(),
compareTop = partial === true ? _bottom : _top,
compareBottom = partial === true ? _top : _bottom;
return ((compareBottom <= viewBottom) && (compareTop >= viewTop) && $t.is(':visible'));
}
$(window).scroll(function() {
if (visible($('.count-digit'))) {
if ($('.count-digit').hasClass('counter-loaded')) return;
$('.count-digit').addClass('counter-loaded');
$('.count-digit').each(function() {
var $this = $(this);
jQuery({
Counter: 0
}).animate({
Counter: $this.text()
}, {
duration: 5000,
easing: 'swing',
step: function() {
$this.text(Math.ceil(this.Counter));
}
});
});
}
})
解决方案
您正在寻找的方法是toLocaleString
. 您可以在数字上调用它来获取您要查找的逗号。您只需要像这样更改步进函数:
step: function() {
$this.text(Math.ceil(this.Counter).toLocaleString());
}
推荐阅读
- c++ - 从文件中读取数据会增加额外的空格
- asp.net - EvoPdf - “本地 IIS”中的错误无法开始转换。WinApi 错误 5 检查“evointernal.dat”文件执行权限但“IIS Express”中没有错误
- php - PHP - 用页面上的域替换相对路径
- python - 无法让 Subprocess.Popen 运行参数,但批处理会
- javascript - TypeError: props.render is not a function (React hook form)
- python - 计算numpy数组中每个元素的出现次数,其中元素在元素上与另一个数组相等?
- python-3.x - 函数的单元测试抛出异常(代码覆盖率)
- azure - Azure 插槽交换作业处理器失败:无法为站点交换插槽,因为插槽中的工作进程中止了预热请求
- .net - -2146232576 是缺少或不正确的 .NET Framework 版本的标准退出代码吗?
- css - 移动菜单切换 onclick