views:

326

answers:

1

Does anyone know of a neat jQuery effect that will make an image randomly flicker or flash? Most of the posts on here are "how to stop flickering" etc, so it's pretty hard to find anything about actually making the image flicker ON PURPOSE.

+1  A: 

With this as your HTML:

<img id="test" src="http://sstatic.net/so/img/logo.png"&gt;

Use this as your javascript:

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

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

If anyone has feedback on this, lemme know. I'm not sure if this is the safest method of doing things. I tend to avoid using setTimeout, but I don't know of any other way to do this. This is a random flicker so when the img is visible, it will be set to hidden with 0.5 probability every 100 seconds and when it is hidden, it will be set to visible with 0.5 probability every 100 seconds. The timeout parameters can be tuned for different kinds of flickers.

Let me know what you think.

Jieren