CSS for Responsive Header

OK, so here’s what I got.

There are two javascript columns:

  1. The first one is the javascript column with the 5 second delay. It is triggered by the current time. It waits 5 seconds (actually 4.5 seconds so it can finish before the next cycle runs) and then returns a unix time as the “random” value that is passed into the second column.

    Current Time is pass as a parameter, but it is not used in the actual code. It is only there to be a trigger to force the javascript to run.

function resolveAfternSeconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(new Date().getTime());
    }, 4500);
  });
}

return await resolveAfternSeconds();
  1. This is the second column with @Himaladin’s javascript. Currently I have 10000 changed to 5000. Otherwise the math would only allow the value to change every 10 seconds regardless of how often the javascript runs. This change seems to allow it to update every 5 seconds instead. @Himaladin I understand what you are saying about the possibility of it skipping numbers. I’m still trying to determine if that is the case or not (haven’t put a lot of thought into the math that is happening). Would you maybe have an example of a Limit value where this could possibly be the case?

    Limit is a parameter for obvious reasons. Current Time and the value from the previous javascript column are passed as parameters, but again, then are not used in the actual code. They are only there to be a trigger to force the javascript to run. Current Time changes every 10 seconds, and TriggerWithDelay also changes every 10 seconds, but with a 5 second offset.

let limit = p1;
let currentCounter = Math.floor((new Date().getTime() / 5000) % limit) + 1;

return currentCounter;

Give it a shot and see if it works. If not, let me know.

4 Likes