Animated GIF replacement?

[chinnr]

I was wondering what people are using instead of animated GIFs. I’d like to stay away from Flash if at all possible. Didn’t know if there were some javascripts out there that would be helpful. The simpler the better.

Thanks!

[TheDoc]

I suppose it depends on what you want to do, but I’ve heard simple Flash stuff is pretty easy. (I don’t know anything about Flash at all, nor shall I ever!)

[chinnr]

Yeah, I’m not a big fan of Flash. Plus I would like it to be viewable on an iPhone.

[TheDoc]

What are you trying to accomplish?

[chinnr]

I need to display a series of photos with a transition between each that is a non-Flash, non-animated GIF solution.

[apostrophe]

http://malsup.com/jquery/cycle/

[AshtonSanders]

Sweet. Jquery is definitely the next item on my "got to learn" list. Those are super cool.

[apostrophe]

You don’t really need to learn jQuery to use plugins like this one, it’s pretty much self-contained, a simple ‘view source’ will tell you all you need to know.

If you are interested in learning jQuery here’s a nice little primer http://spyrestudios.com/simple-guide-how-to-get-started-with-jquery/ and then there’s a 15 part screencast series on themeforest beginning with this http://blog.themeforest.net/screencasts/jquery-for-absolute-beginners-video-series/

[chinnr]

"apostrophe" wrote:

http://malsup.com/jquery/cycle/

That’s more like I’m looking for. Thanks! Now… if I can only get it working. I download the various scrpits, copied them to the root level of my server. I also put my html file there (root level) and a folder of pics. I copied the code they used on the demo site, modified with my pic names, and uploaded. It just displays my images in a row, with no motion. You can see here:

http://www.chinnr.com/pictest.html

I’m probably missing something easy, but I don’t know what it is. Any suggestions?

Thanks for the help!

[apostrophe]

Have you actually downloaded jQuery? Otherwise you can link direct to the google hosted version.
You also have a lot of unneccessary code in there that relates to other examples.
Should look something like this:

Code:

If that doesn’t work then rename "jquery.cycle.lite.js?v1.0" to "jquery.cycle.lite.js" and change the link in the head to match (I have had a problem with that before).

[chinnr]

apostrophe,

You the MAN! Thanks so much for your help! I do have jQuery at the root of my server, but I like the idea of using the Google hosted version.

There was a naming isssue with the cycle lite js file, so I got that corrected. Then I used your code and everything worked. I knew I had a lot of code in there I didn’t need, but I was trying lots of different things – that probably made it worse though I’m guessing. I think the other key that I was missing was the CSS you added.

Thanks again for your help!

Once again CSS Tricks saves my bacon!

[Brynhowlett.com]

Here is how SublimeText did their Animated Gifs… The hard way using PNG. Animated Gifs the Hard Way

http://www.sublimetext.com/~jps/animated_gifs_the_hard_way.html

Thought this was appropriate but I have played with it and it takes way to much time compared to Gif’s but if its the front and center of your homepage might be worth it to try out.

Hope this helps.

[shaneisme]

Impressive necro.

[Author]

Posts