xlsdg / vue-countup-v2

Vue.js component wrap for countUp.js
https://inorganik.github.io/countUp.js/
MIT License
379 stars 56 forks source link

Add ability to not start a countup on mount #17

Closed kylemilloy closed 5 years ago

kylemilloy commented 5 years ago

This is a fix for #16

kylemilloy commented 5 years ago

Use case would be if you have a countup that's below the fold that you don't want to countup right away. So you'd do something like

<count-up :end-val="100" :start-on-mount="false" @ready="onReady" />
onReady(countUp) {
  window.addEventListener('scroll', evt => {
    evt.pageY > countUp.target.getBoundingClientRect().top ? countUp.start() : null;
  });
}
xlsdg commented 5 years ago

use delay option.

mcking49 commented 4 years ago

@xlsdg delay option only delays by time. What if you want logic to control when the animation should start? I.E. when the countup component scrolls into view.

xlsdg commented 4 years ago

@mcking49 set delay to -1, when the countup component scrolls into view, call instance.start().

mcking49 commented 4 years ago

@xlsdg Cool. There is no documentation regarding using -1 as the delay value. Would be good to add.

uzzal-ht commented 4 years ago

I have same issue. Can you share any live example?