Hello,
I’m going to be working on a new site and I wanted to make an image of a gem rotating on the home page. I would normally try to do this with flash, but for unknown reasons I was told not to use Flash. Any suggestions on what would be the best way to go about this?
Thanks!
Sure, two words: Animated Gif
If you search for this there are sites that help you make them too.
I forgot to mention I’d rather not use an animated GIF because the quality decreases.
Hmm, fat, bloated, requires a plugin, plugin not available to all devices… plenty of legitimate reasons not to flush a perfectly good website down the crapper with “flash for nothing”… there’s a reason the term “flashtard” exists; using flash for ANYTHING other than FMV or games on a website == pointless bloat.
But I’m one of the people who HATES flash on websites for anything other than a game or videos like youtube; to me using it for anything else is just turning the website into useless garbage… and don’t even get me STARTED about all the total trash completely useless websites that are built in nothing BUT flash – see the official websites for most computer games.
Well, if you don’t have flash and since GIF sucks (which it does!) the only real answer for animated is going to be to use javascript… which ends up leaving us asking more questions:
is the user going to interact with the animation, or is it just a fixed rotation?
is this going to be a vector drawing or multiple static frames (like jpegs)?
Is the client going to get their panties in a wad if it doesn’t work when javascript is disabled (NOT that there’s a lot one can do about that in the first place)
Those answers can change how you handle it a good deal.
If it’s just a non-interaction bunch of static frames, that’s easy enough to do using settimeout and by loading the individual images from the scripting – you could even ‘filmstrip’ them to a single image one over the other and slide them around as a background to show the one you want…
While it might look crappy, you could also create a .gif for people browsing without javascript, and put it into a NOSCRIPT tag in the markup.
If you have the frames/images I could toss together a quick code example on how it’s done.
You might ask in the javascript section of these forums too – just be leery of those who will tell you to use some off the shelf 20k script that relies on a few hundred k of scripting libraries to do the job of 2-4k of REAL javascript – usually because the person who wrote said scripts knows not enough javascript AND not enough CSS in the first place.
In other words, just say no to jquery, mootools, yui, etc, etc…
I would second this recommendation.
Hey deathshadow,
Thanks for your suggestions and explaining the reasons not to use flash. I don’t think it’s going to be interactive. It’s basically going to be a fixed rotation. I have about 6 jpegs I wanted to experiment with. I’ll send them on over to you too. I’m not very familiar with javascript, at least not yet. You’re right, it might be a good idea to post this question in the javascript forums too. Thanks again!
Wow … I’ve travelled back in time and it’s 1997 again 
Come on, that kind of animation is soooo last millennium … or are you really going for this kind of site?
My stock advice is that looping animations tend to hold a visitor’s interest for juuust long enough for them realise how annoying it is and move off. How many popular sites employ animations (other than for presenting content)? If the feature is a must have, ensure a means to pause the animation is provided.
I agree that a rotating image can be cheesy if done improperly.
One option you may want to consider is doing the rotation only on hover?
http://goodchee.com/ has a rotating animation of their logo on hover (they use CSS3 animations, so you can only see the rotation on webkit browsers like Chrome or Safari)
