滚动触发特效

<div class="index_shuzi_bg">


    <div class="index_shuzi">
      <li>
        <dt num=‘2012‘ id="index_sz1">0</dt>
        <dd>公司成立于2012年</dd>
      </li>
      <li>
        <dt num=‘21‘ id="index_sz2">0</dt>
        <dd>21条现代化气雾剂全自动罐装线</dd>
      </li>
      <li>
        <dt num=‘30‘ id="index_sz3">0</dt>
        <dd>业务已广泛覆盖30个国家和地区</dd>
      </li>
    </div>
  </div>
  <script>
    function gundong(_id) {
      let _obj = $(_id);
      let _num = parseFloat(_obj.attr(‘num‘));

      let index = 0;
      let sudu = _num / 17.8;
      let inter = setInterval(function () {
        index += sudu;
        if (index >= _num) {
          clearInterval(inter);
          index = _num;
        }

        _obj.html(Math.ceil(index));

      }, 56)
    }


var
scroll_obj = [‘.index_shuzi‘,‘.index_shop_category‘,‘.index_pro_box‘,‘.index_about_bg‘,‘.index_pro_more1‘,‘.index_pro_more2‘,‘.index_huanjing_bg‘,‘.index_news_bg‘]; var index_shuzi_top = $(‘.index_shuzi‘).offset().top; var window_height = $(window).height(); $(window).on(‘scroll‘, function () { let scorll_top = $(window).scrollTop(); scroll_obj.forEach(element => { let top = $(element).offset().top; if (scorll_top + window_height > top){ let funname = element.substr(1)+‘_fun‘; if(is_function(funname)){ eval(funname+‘()‘); }else{ $(element).addClass(‘cur‘) } let index = scroll_obj.indexOf(element); scroll_obj.splice(index, 1); return false } }); } ) function is_function(functionName){ try { if (typeof eval(functionName) === "function") { return true; } else { return false; } } catch (e) { } return false; } var index_shuzi_fun = function (){ gundong(‘#index_sz1‘); gundong(‘#index_sz2‘); gundong(‘#index_sz3‘); }

 

滚动触发特效

上一篇:CF842D题解


下一篇:ogp prefix 怎么写