Forums

decalko

Hi everyone,

I've come across an interesting Price Estimator on this website : http://premium.wpmudev.org/
It is on the home page in the middle of it.

I'd like to know how to make the effect on the text below it : when you use the slider, the text change to another value by incrementing quickly.

It is quite hard to explain so I guess the best is to have a look at it.

Does anyone has a clue ?

Thanks.

cyneWATCH

JavaScript, but I know no more.
Probably just looking at the position of the slider, then incrementing the number to the one defined by the position. It then just animated the number going +1 until it reaches the goal.

decalko

Thank you for your reply, if anyone has got a link so I can document my self on that....

Cwapface

I did some research, as I was also curious how his was done, and found this site:http://www.josscrowcroft.com/2011/code/jquery-animate-increment-decrement-numeric-text-elements-value/

That was all I needed to make this fiddle:http://jsfiddle.net/CoolDavidiscool/mCAvg/1/

I will try and update it with a slider soon. Maybe on my break...

cyneWATCH

Nice! I've cleaned up your jQuery code BTW, just made it easier to maintain and shorter, more modularised.
New fiddle: http://jsfiddle.net/8w8w9/

decalko

cyneWATCH and Cwapface , you a re the bests !!!! THANK YOU SO MUCH.

treehouse : what would you like to learn today?

Forums

How to achieve this amazing effect ?