View Full Version : Animated gif background?

02-07-2012, 01:20 PM
I am doing a website for a client that has to do with show dogs and she would like an animated background with puppies that float down the screen. That is what she wants. I do not want to use flash and guess I would try and do this with animated gifs and a fixed background.

I am not asking for details, but was hoping that someone could please point me in a direction. Thank you very much, Buffmin

02-07-2012, 03:17 PM
You could do something similar like this CSS3 page is doing with animation:

If it was me, I would look to talk them out of it, especially since I, nor most people have never done something like this before. You want visitors to focus on content not some dog floating by. Manage their expectations right of the bat when they mention they want this done. Tell them you'll look into it, and it is not a common request, and could possibly cost additional $$ due to the time spent to accomplish the task.

02-07-2012, 03:27 PM
Hi jackDanielst. That page doesn't seem to work right in my IE8, but does work fine in firefox. Pretty cool, really. I wasn't sure if the browsers are all cs3 ready.?

I know it is a useless option, but I am just trying to give the customer what the customer wants. Just hoping there was an easy way to do this. Didn't know if I could could do it with javascript of jquery maybe?

02-07-2012, 03:54 PM
Buffmin, I would advise you that as designer you educate your client what’s good and bad practice in web design. Explain her that animated background images are counter productive because they are distracting from the actually relevant things on the site. Animations should be used very sparsely and unobtrusively and special care should be taken as to when to use animations. It definitely shouldn’t be used just because one might casually think it’s funny and entertaining.

Giving your clients what they want is just half the job. The other half is to guide them and let them know that you are the designer and you know what should and shouldn’t be used for a successful professional website.

Now, that said: If you still want to have animation going on then you might wanna look into the emile animation framework (http://dailyjs.com/2009/11/03/emile/). It’s used on http://benefitcosmetics.com/, for example.

02-07-2012, 04:20 PM
Thanks folks. Points taken, and thank you for the links. Buffmin

02-07-2012, 05:00 PM
You're correct, I believe the only major browser it doesn't work in is IE. There is also a jQuery animation framework out there, but nothing is going to be as easy as making a gigantic animated gif which could come out to be a pretty large file size depending on what the image contains.

02-07-2012, 06:28 PM
Thanks Jackdaniels.