Hi again.
Time to pick your brains some more. I am wanting to have some space on one of my pages where there are rotating images. So the image will change nicely every few seconds.
Now - I know there are a few ways of doing this - I could make a flash movie, or just have it so the image changes every time the page refreshes or force the page to refresh every however often.
My question - what is the best way of doing it!? Is there a Drupal module I can use and if so - which one?!
I know the flash idea would work but really I would like it so that my author can upload images to a folder and have them including in the rotation.
What do you reckon?
Cheers.
A.
JQuery
To me, this screams Jquery Javascript...
I'm not a .js guy myself...so I couldn't tell you how to do it (and I don't know of a module), but this would allow you to have a 'flash-like' rotating image display (with tons of different animations) all while pulling images from a folder on your server.
MF, any suggestions on where to learn how to do this?
-Rob Feature
Geeks and God Co-Host
www.bobchristenson.com
definitely jquery
This is something that's definitely jquery. I actually did something like this on a recent project.
Now, I am not sure of any module that does this right now. This could be done as part of a module or a theme. It really depends on where you want this. But, I don't know of anything existing.
There are a number of jquery plugins to help with this. One is the innerFade plugin (http://medienfreunde.com/lab/i...). It lets you take a list and turn it into an ordered rotation. You could even build the list with views. It you have a node type that accepted images you could make a list of those images (and have it random if you like) and then use jquery to turn it into rotating images.
This is just one example. If you dig into jquery a little and know how to custom code in drupal there are a million ways to do it.
Some other sites to look at are:
http://visualjquery.com
http://jquery.com/plugins/proj...
http://drupal.org/node/508
Matt Farina
Geeks and God Co-Host
www.mattfarina.com
Oooooh I like that one @ medienfreunde.com
I just implemented a slideshow script that allows you to place images, text, links etc. into the div element that rotates on the home page of one of my work sites (marathonequipment.com). You can get that script here slideshow.barelyfitz.com.
Or just grab the code directly from my site.
However I really like the the looks of the one that Matt linked to at medienfreunde.com (whew try saying that url three times fast...).
-Rick
what if you have LOTS of images
Hi Matt - I had a look at the innerfade plugin - it's very, very nice. I got it working with relatively little effort.
Obviously all the images need to get downloaded up front, and then jquery will be selectively displaying them according to whatever settings I set up in the innerfade plugin. Problem is, what if I want to have lots of images, on a really slow rotation?
I want to include a pseudo random image on the front page of our site (or anywhere eventually, in a block), however we want to select from possibly hundreds of images. Thus every time a visitor comes to the site, they would see something visually different, on a regular basis.
Obviously the jquery solution won't work here, because there would be just too much image data to download!
It also fails on delightful browsers like IE6 which don't support javascript out-of-the-box...
Do you know if there is another elegant solution for this? We don't really need to fade in/out, and we would only need to change our image every couple of minutes/hours. I'm thinking perhaps a cron script which would load a specified directory with a single random image from the "library". This would then get displayed when the user visits the page.
As an extension, perhaps I could use a cron script to load up a "selection" of images which we could then cycle through using the innerfade plugin... that could look really nice.
Does this sound like a good way to do this?
I've done this...
There are a bunch of ways you can approach this.
First, I want to talk about IE6. It doesn't support javascript out of the box? Sure it does. And, it supports AJAX and AHAH out of the box. Unless you have a different configuration in Australia.
Here are a few thoughts.
1) You have an image load at random from a directory. Each time a user sees this image it will be new. If you are using page caching (which I recommend at all times) have a cron script clear your cache every so often.
If you are using drupal write a custom module that calls hook_cron and hook_cron just needs to call cache_clear_all(). This will clean the page cache every time a cron job is run thus grabbing an image at random.
2) You can use javascript for this. One thing I did was has an image display at random on a page. This allowed it to gracefully degrade when javascript didn't work. Then, I had some jquery code that was generated on every page load with a list of 20 images. The code would then fade out the starting image and fade in a different image of the random 20 every so many seconds. The 20 images were generated at random on each non-cached page load.
This solved my problem of having multiple images and caching without going through the entire list. It's not truly random each time but random enough that it worked for my situation.
Matt Farina
Geeks and God Co-Host
www.innovatingtomorrow.net
www.mattfarina.com
Thanks again!
The two words I seem to say round here way too much... please and thank you!
Another huge thanks for those links and ideas. I'm getting into jquery a little now. You never know - I may be able to use it by the end of my holiday (have I mentioned lately I have six weeks without work?!)
Thanks again guys.
A.
--
Andy Hoyland
andy@stjb.org.uk
http://www.stjb.org.uk