JQuery n00b: Image fader
- Started
- Last post
- 7 Responses
- thismanslife
I've just spent the last hour trawling through a ton of JQuery plugins for making image fading slideshows, and I'm not sure which one is the "best"...
I'm looking for something which fades smoothly through images, can (optionally) include captions and slide navigation, flexible/customisable in appearance, only show caption + nav onMouseOver. I'd also like to define the sequence of images in the page markup, not in the script. Same applies to the associated caption, and any link (href) on the image being shown.
This one allows all of the above (I think), except the images are defined in the script, so not quite perfect:
http://www.recoding.it/wp-conten…...any recommendations?
- bigtrick0
This probably doesn't help you much... but I used mooshow on the last version of my site to achieve this:
http://corvail.com/index-old.php…
you can look at the source of the iframed docs - here's an example:
http://corvail.com/fashion.html
I guess this isn't quite helpful, since I define the image array in the js... sorry.
- yo, i really like that archbishop job shot!baseline_shift
- hey I like how the next buttons show up on mousoverEtype
- nicejuhls
- Etype0
i just used the easy slider:
www.ericpier.com/index.html
- thismanslife0
That's nice Eric, but not really want I'm looking for :(
- thismanslife0
No one else?
- thismanslife0
Just got a REALLY nice email from the creator of "Showcase" as I linked to above - turns out it CAN do exactly what I want, plus a lot of other customisable aspects I hadn't realised!
"I wrote to you only to say that you CAN do what you need.
As you can see in the documentation (http://plugins.jquery.com/proje... there are two ways to define the imagelist: by script or by a sequence of anchor tag containing the images, inside your div. Something like:[div id='showcase']
[a href='...'][<img /][/a]
[a href='...'][<img /][/a]
[a href='...'][<img /][/a]
[/div]etc...
Just omit the parameter "images", and use $("#showcase").showcase({ ...other options... });
I hope this helps you!"
...So there you have it! Thanks to Eros :)