Question

I’m using this code to make my logo flicker on my website. But It becomes annoying when it continues to flicker while browsing, how can I set a time to allow it to flicker for something like the first 15seconds on page load, then stops?

JS code I’m using:

$(document).ready(
function(){
    var t;
    const fparam = 100;
    const uparam = 100;
    window.flickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","hidden");
            t = setTimeout('window.unflickr()',uparam);
        }
        else
            t = setTimeout('window.flickr()',fparam);
    }
    window.unflickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","visible");
            t = setTimeout('window.flickr()',fparam);
        }
        else
            t = setTimeout('window.unflickr()',uparam);
    }

    t = setTimeout('window.flickr()',fparam);
});

Answer 1

You could have a counter, which you then use to decide whether you want to set another timeout. As a side note, you should never add functions to window and then passing a string to setTimeout. Always just pass the function itself:

$(document).ready(function(){
    var t;
    var amount = 0;
    const fparam = 100;
    const uparam = 100;

    function timeout(f, t) {   // this function delegates setTimeout
        if(amount++ < 150) {   // and checks the amount already (un)flickered
             setTimeout(f, t); // (150 * 100 ms = 15 s)
        }
    }

    var flickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","hidden");
            t = timeout(unflickr,uparam);
        }
        else
            t = timeout(flickr,fparam);
    };

    var unflickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","visible");
            t = timeout(flickr,fparam);
        }
        else
            t = timeout(unflickr,uparam);
    };

    t = timeout(flickr,fparam);
});