Flickering image to Fade?

[kels]

Ok, I am not sure the best way to go about doing this. I used to code in Flash, but I am making the trassision over to JQuery/JavaScript/HTML5/CSS (I am a lot more comfortable with HTML and CSS), so needless to say, I am new to this.

What I am trying to do is have an image flicker in (think bad cable connection) 2 or 3 times then pause for about 5 second and then fade out for good. Where should I start with this? Any help would be greatly appreciated. Thanks in advance.

[dfogge]

this is tough to search for (most references to images flickering online are attempting to remove them)

i did find this though: http://www.webegg.co.uk/flicker-effect-with-jquery/

seems like a good starting point if you want to accomplish this with jquery. on the other hand if youre only supporting modern browser you can do it using pure CSS.

if you wish to go that route, here are mr coyier’s css keyframe animation code snippets to get you started: https://css-tricks.com/snippets/css/webkit-keyframe-animation-syntax/

[kels]

Awesome! The more I thought about it, I was thinking of something along the lines of the jquery effect you found. I was going to sit down and code it out today or tomorrow, however this tut’s code is SO much cleaner than what I was planning. THANKS!

Still learning the best way to code jquery.
Going to test it out and hopefully marked solved.

[kels]

Went with the CSS effect on this one. Crazy simple. Thanks dfogge!

[Author]

Posts