Count Up動畫當元素對用戶可見時

-2

我有一個問題，即時使用多個元素的計數動畫，只爲第一個元素啓動一次。Count Up動畫當元素對用戶可見時

而即時通訊也試圖在html中設置「counting-to」值。是否有一種簡單的方法將它們加載到每個元素的js中？

在最後im試圖得到加法動畫開始時，通過向下滾動用戶可見div。當其可見時，它應該保持原樣運行動畫一次。

只有當用戶將元素從可見性中滾動出來時，如果元素再次可見，它應該重置並重新開始。

有沒有人知道我能如何解決這個問題？

繼承人的代碼：

function animateValue(id, start, end, duration) { 
    var obj = document.getElementById(id); 
    var range = end - start; 
    var minTimer = 50; 
    var stepTime = Math.abs(Math.floor(duration/range)); 
    stepTime = Math.max(stepTime, minTimer); 
    var startTime = new Date().getTime(); 
    var endTime = startTime + duration; 
    var timer; 

    function run() { 
     var now = new Date().getTime(); 
     var remaining = Math.max((endTime - now)/duration, 0); 
     var value = Math.round(end - (remaining * range)); 
     obj.innerHTML = value; 
     if (value == end) { 
      clearInterval(timer); 
     } 
    } 

    timer = setInterval(run, stepTime); 
    run(); 
} 

animateValue("value", 0, 75, 2000);

來源

2013-12-14 user3102562

需要在座相關的代碼有問題......不是在一個遠程站點的鏈接，人們會必須仔細研究文件以確定代碼的可能位置 – charlietfl

請將您的代碼發佈到此處而不是鏈接網頁 – Oriol

您可以添加一個類的元素，一旦動畫開始了第一次，然後用選擇元素：沒有選擇。例如，選擇動畫的div像這樣：

$('.animation_div:not(.animating)');

再後來當動畫開始：

$('.animation_div').addClass('animating');

來源

2013-12-14 18:57:33 koosa

Count Up動畫當元素對用戶可見時

回答

相關問題