Grow your CSS skills. Land your dream job.

Last updated on:

Call Function with Random Timer

function randRange(data) {
       var newTime = data[Math.floor(data.length * Math.random())];
       return newTime;
}

function toggleSomething() {
       var timeArray = new Array(200, 300, 150, 250, 2000, 3000, 1000, 1500);

       // do stuff, happens to use jQuery here (nothing else does)
       $("#box").toggleClass("visible");

       clearInterval(timer);
       timer = setInterval(toggleSomething, randRange(timeArray));
}

var timer = setInterval(toggleSomething, 1000);
// 1000 = Initial timer when the page is first loaded

View Demo

Comments

  1. Why do you use this array of times ?

    Here is a more randomly way :

    function toggleSomething() {
    // do stuff, happens to use jQuery here (nothing else does)
    $(“#box”).toggleClass(“visible”);

    clearInterval(timer);
    timer = setInterval(toggleSomething, parseInt(Math.random() * randomWidth));
    }

    var randomWidth = 3000;
    // The random range will be from 0 to 3000, or whatever you want !
    var timer = setInterval(toggleSomething, 1000);
    // 1000 = Initial timer when the page is first loaded

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".