Click to See Complete Forum and Search --> : doing Flash-like animation w/o Flash


2ms
02-18-2008, 12:16 PM
I'm working on a site that supposed to be entertaining to kids. It is requested of me to make an animation involving sound and "layers" to appear on the page after it has been loaded for a little while.

Specifically, I need to make a set of footprints run across the screen with a sound effect coinciding with the appearance of each footprint.

Is this going to be hard? I'm guessing I'm going to need to have an overlaying layer with the footprint graphics on it and the graphic visibilities initially turned off, and then, one by one, I make each footprint visible (w Javascript) while simultaneously triggering sound effect?

Any advice/suggestions would be appreciated. It's been about six years since I've done any kind of "dynamic html" stuff.

dtm32236
02-18-2008, 02:50 PM
why no flash?

w/o Flash - it sounds like you may have it worked out... you're going to have lay it out as it will look when all footprints are there - then hide them, and have a JS script that makes them visible every X (mili)seconds, and as you said, make it coincide with the sound.

Sounds like it can be frustrating, but it also sounds doable, and i think your going about it correctly.

2ms
02-18-2008, 02:55 PM
I can't do Flash for two main reasons: (1) that the customer does not want Flash to be required for the site (2) that the rest of the page is already done in pure html/css in layout that consistent with the rest of the site and the footprints would be added on as little animation just for this one page and they would be going "over" the page but you can't layer Flash on top of other stuff.

Well, I'm glad to hear there's hope. Any suggestions on sites I might visit in order to learn more about how to do this sort of thing?

TJ111
02-18-2008, 02:55 PM
Look into using a javascript animation library. They will make developing animations/effects much easier then coding it by hand. Off the top of my head I know mootools and scriptaculous both offer methods to accomplish this. Triggering sound via javascript will be slightly more difficult though.