Count Up Plugin

I need a plugin that counts up based on time (meaning every 3 seconds it increases by one). Does anyone have a good suggestion of one that is customizable?

Hello @jdesign!

Maybe this is what you were looking for?

View: CountUp.js

1 Like

@MinewireNetwork Sort of but not exactly. The client host data and wants to demonstrate the amount of data currently stored and increasing every 15 or 30 seconds. Which I guess means the starting point number might need to be flexible?

Wellā€¦ To do it the way your client wants the number needs to be accessible for read and write for the script. Webflow doesnā€™t support that functionality.

@bartekkustra Ultimately, we will be exporting the site. Do you know of a script/plugin that has that functionality? Iā€™m good with basic jquery but still learning.

@MinewireNetwork Actually, that might work. How do I go about adding to WebFlow

@jdesign Actually, thatā€™s the one part of Webflow that I am trying to learn still. Sorry that I canā€™t help, but I am sure that someone else will be able to help you.

Tally-ho

well if youā€™re using something like cold fusion or php, and assuming the clients ā€œdataā€ is in a database (or where on earth else is it?), then you just query the database every x seconds and output the total into the page (or query the dir for total files)

umā€¦ easier, but not as robust & offering only a simple ā€˜instance of data addedā€™ countā€¦ if you have access to the server & the data-add page (assuming the data is being added from an uploader of some type which presents a ā€˜successā€™ return on complete, just have a cookie which counts up with each ā€˜addā€™ and display the cookie total every x seconds.

Yes and no. Imagine having a query every 3s to database on a page viewed by 100 people. Thatā€™s a lot of queriesā€¦ Also something has to update the value itself and it has to be triggered by a client.

My suggestion would be to have a table that stores lastUpdate and currentValue. Now when someone gets on the page it should do the following:

(Now() - lastUpdate)/3 + currentValue

This will update the value once per every page refresh. Then a javascript should be called on a client-side to update the value every 3s. That way we will have a little amount of stored values which will be a better optimization for database.

But then againā€¦ that require PHP and a database somewhereā€¦

yeahā€¦ much better- if they want an update every 3 seconds then either they are completely insane or the value potentially changes every 3 seconds

not sure what he means by ā€˜dataā€™ tho, he never defined it. as i assume it to mean, the lastupdate table gets updated only when a new bit of ā€˜dataā€™ is added.

the way he describes it though sounds like they want the actual value to display 3 second updates

actually reading it again it makes no sense.

ā€œI need a plugin that counts up based on time (meaning every 3 seconds it increases by one).ā€

but then

ā€œThe client host data and wants to demonstrate the amount of data currently stored and increasing every 15 or 30 secondsā€

not sure how the two ā€˜add upā€™ (ha!)

^^ Whatever the delta time is we need to focus on the update schema. Letā€™s see:

  1. User gets on website Script #1 reads the database for lastUpdate and currentValue \
  2. Script #1 does the math Iā€™ve written above resulting in the calculated currentValue being updated on server
  3. Script #1 prints out the current value to the variable on website
  4. Script #2 adds some values every T seconds.
  5. User refreshes the website
  6. Script #1 starts againā€¦

The T can be changed any time as well as the value being counted up each T seconds by a certain amount. While this can be adjusted by a script easily. The problem will be with setting up a database and PHP for Script #1.

@wolfie The first was an example. The second was specifics directed back to @MinewireNetwork, when I asked him how to integrate the plugin he mentioned as Iā€™ve added basic scripts but didnā€™t understand how to install the one that he mentioned.

The two ā€œadd upā€ simply because they are examples. @bartekkustra didnā€™t have trouble understanding that was an example of data time as is clear in the response. This is an example of what the client is looking to do http://www.ookla.com

@wolfie Also, it looks like you are a pretty new user to Webflow. Typically, Webflow users come to the forum to search for answers, answer questions and help each other. If you are able to help answer the question then your input is appreciated otherwise just donā€™t participate.

this is nothing to do with webflow jdesignā€¦ webflow is purely a front end design editor but with interaction with server obviously to write the stylesheets and html pages to the server as one edits.

My own experience is in building bespoke ordering, catalog, customer tracking/job-management etc systems and intranet systemsā€¦ everything to do with manipulating data in and out. Iā€™ve even build complete automated user-website creation systems.

So with all due respect you have asked for help yet still havenā€™t defined what ā€˜the dataā€™ is, where it resides and in what formatā€¦ that is kind of relevant if one is asking people who specialise in data manipulation how to do something with ā€˜dataā€™.

http://www.ookla.com/ which you listedā€¦ with all due respect, ISNā€™T an example, because YOU havenā€™t defined what your data is and where it resides etc as i said

i mean , lol, anyone can bung a counter on a page and say ā€œthis is how many speedtest are happeningā€ā€¦ who says the counter is real and tied to any actual events? :wink: (this happens trust me)ā€¦ one will note the ookla counter is absolutely updating at a fixed interval, so how it is in anyway relevant is beyond meā€¦ :smile:

bartekkustra ā€” yeah, the way iā€™d do it with say a playcounter for a music website is:

iā€™d have a ā€˜playsā€™ table, and as user hits play on the ā€˜playerā€™ interface, ajax (or similar) would query the table via track ID number, get the current PLAY total. Then iā€™d do some simple math to create the new total variable:

#playtotal# + 1 = #newtotal#

and inject the newtotal it into the table ā€˜playtotalā€™ field via the trackā€™s ID number.

sorted :wink:

but again, you say:

"User gets on website Script #1 reads the database "

we still dont actually know his data is in a table even, and also we may not even need a table & to query a table to get a ā€˜totalā€™ - we can just query the dir for total files as i saidā€¦ it all depends what this mysterious ā€˜dataā€™ is.

Secondly, the ONLY way heā€™s gonna get a REAL total is by querying the data total (whatever/wherever it is)ā€¦all this goobledegook about ā€œ3 secondsā€ stuff is irrelevant, UNLESS he means we wants to query the REAL total every 3 seconds. I mean what possible point is there is this ā€œ3 second timerā€ otherwise?

ergo, the only possible solution is:

  1. query the actual total (which as you say can be updated to a ā€˜totalsā€™ table/field when user ADDs ā€˜dataā€™ - letā€™s presume itā€™s user document uploads maybe?)

  2. output the REAL total via an ajax (or similar) div and refresh it at a fixed interval - that way nothing needs to be re-set when users loads page, no actual maths is being done on the readout pageā€¦ BUT, absolutely the ajax (or whatever) must query to get a REAL total each time it reloads or the total is only ever going to be: ā€œtotal when you loaded the pageā€

:wink:

@bartekkustra Thanks for the information.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.