2016-11-24 44 views
0

我正在使用jquery animateNumber(http://aishek.github.io/jquery-animateNumber/)來動畫兩個數字。這按預期工作。使用時出現重複的動畫編號

我也使用jQuery出現(http://morr.github.io/appear.html

當我重新加載網站上,這裏的數字放在段,動畫作品完美,但是當我使用它一起出現,它不斷重複4- 5次,然後停在它應該達到的數量上。

我不知道爲什麼這樣做。

我做了一個小問題的記錄。

https://drive.google.com/file/d/0B7hawEXeq3fwWmdZdU1qbUwxOGs/view?usp=sharing

這是我的腳本來控制動畫

$('#financialNumbers').appear(); 

     $('#financialNumbers').on('appear', function() { 

      $('.timer.result').animateNumber(
       { 
        number: 690, 
       }, 1500 
      ); 

      var decimal_places = 1; 
      var decimal_factor = decimal_places === 0 ? 1 : Math.pow(10, decimal_places); 

      $('.timer.percentage').animateNumber(
      { 
       number: 11.9 * decimal_factor, 
       numberStep: function (now, tween) { 
        var floored_number = Math.floor(now)/decimal_factor, 
         target = $(tween.elem); 

        if (decimal_places > 0) { 
         // force decimal places even if they are 0 
         floored_number = floored_number.toFixed(decimal_places); 

         // replace '.' separator with ',' 
         floored_number = floored_number.toString().replace('.', ','); 
        } 

        target.text(floored_number); 
       } 
      }, 1500 
      ); 

     }); 

     $('#financialNumbers').on('disappear', function() { 
      $('.timer').text(0); 
     }); 

回答

0

我固定它使用jQuery isinviewport