Question

首先，我要为这个问题的框架道歉。关于我的编码技巧，我是一个婴儿。

我正在尝试在我的Squarespace网站上实现一个计数序列，到目前为止我已经到了这里（下面的代码）。现在我尝试以行

的方式设置此代码

<div class="sqs-col sqs-col-4 counter-value" data-count="179" data-desc="Days completed">0</div>

我想计算自公司开始日期以来经过的天数，而不是手动输入数据计数值。类似于发现here的东西。一旦计算出来，计数序列就会将该数字视为数据计数值。

现在我在论坛和不同的网站上看到了各种计时器代码，但是，我们还没有成功地将其与我在这里的代码集成。

对此有任何帮助将不胜感激。

＆＃13;

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
var a = 0;
   $(window).on('load', function() {

   var oTop = $('#counter').offset().top - window.innerHeight;
  if (a == 0 && $(window).scrollTop() > oTop) {
    $('.counter-value').each(function() {
      var $this = $(this),
        countTo = $this.attr('data-count');
      $({
        countNum: $this.text()
      }).animate({
          countNum: countTo
        },
        {
          duration: 5000,
          easing: 'swing',
          step: function() {
            $this.text(Math.floor(this.countNum));
          },
          complete: function() {
            $this.text(this.countNum);
          }
        });
    });
    a = 1;
  }
});
</script>
<div id="counter">
    <div class="sqs-col sqs-col-4 counter-value" data-count="179" data-desc="Days completed">0</div>
  <div class="sqs-col sqs-col-4 counter-value" data-count="437" data-desc="Projects Executed">0</div>
  <div class="sqs-col sqs-col-4 counter-value" data-count="31" data-desc="Satisfied Clients">0</div>
</div>


<style>
 .counter-value { 
    font-size: 60px;
   line-height:1.2em;
   text-align:center;
   padding:2px 0;
 }
  .counter-value:after {
   content: attr(data-desc);
    display:block;
    text-transform:uppercase;
    font-size: 14px;
    line-height:1.5em;
  }
</style>

＆＃13;

Answer 1

必须更改窗口加载功能，因为在此控制台中存在错误。

错误：

未捕获的TypeError：url.indexOf不是函数在jQuery.fn.init.jQuery.fn.load（VM811 jquery.js：9823）在VM326：60

JSFiddle：here

换了一行：

$(window).on('load', function() {

参考：

URL.indexOf not found

结合2个不同的计数代码来创建特定的结果

1 个答案: