A LIST Apart: For People Who Make Websites

No. 186

Discuss: A Better Image Rotator

Pages

« First  <  13 14 15

141 Nice Script But..........

This was a great script but how do you set it up on a timer?

posted at 08:38 pm on October 13, 2008 by steven wilson

142 ref #47 'Undefined Index ID ' error message

I had this same problem when I switched local server. Everything had previously worked fine.

I found that if you created both an ID & Class in the stylesheet and left the ID blank (but the Class specified) it corrected the error.

posted at 06:35 am on March 20, 2009 by Rogan jOSH

143 Surprise--there's yet another cool way!

Javascript, with a timing loop and a lot of images addressed by their array numbers, is fine for slower rotating where the images will certainly have time to load, or where you’ve done preloading. But experiments have shown me that if you don’t want people waiting for preloads, or if the image size is quite large, or, especially, if the rotation speed is fast (under a half second), there’s a better way. Having tried a rotator doing 600×400 images at 1/3 second, with and without preloads, I found that the browsers went nuts. I use smaller images and 1 second times and standard Javascript image cycling with no problem, but the browsers draw the line at the bigger/faster combo. So guess what works perfect on all browsers? I made an 800K gif with lots of images in it and 1/3 second timing, using ImageForge and MS Gif Animator. I expected browsers to choke on this since no preloading occurred. But they all smiled, winked, and purred! I hope this helps anyone who’s tried to make rotators work with big, fast images and tore his hair out at the results.

posted at 11:17 pm on June 11, 2009 by dondon

144 target ok

i found how to ad the target option:
in the rotator.php, write like that:

# if an url was specified, output the opening A HREF tag if ( $images[$img][‘url’] ) { printf( ‘<a href=”%s” title=”%s” target=”%s”>’, $images[$img][‘url’], $images[$img][‘title’], $images[$img][‘target’] ); }

in the .ini file ad a line:
target =_blank

greats!!

posted at 02:20 pm on December 14, 2009 by 54moon

145 The Border Issue

If you are trying to get rid of the border it is probably not an image border but a ‘link border’. This worked on my page:-
A:hover{color: red; text-decoration:none}
a img {border:0;]
The first line just sets the hover attributes the second the link border.
Secondly you can set the script up to reference different ini files on the same page allowing different pools of images on different places on the same page by renaming the function ‘showImage’to showImage1, showImage2,showImage3 etc and saving each changed file as a separate rotator.php file. ie rotator1.php, rotator2.php etc. The image is called by <?php showImage(‘images2.ini’); ?> or
<?php showImage(‘images3.ini’); ?>
This might be inelegant but it works . . .

posted at 10:20 am on March 12, 2010 by galleries

146 HI

Excellent information here cause in my language, there are not much good source like this. This interesting post made me smile. Maybe if you throw in a couple of pictures it will make the whole thing more interesting.

posted at 08:21 am on September 24, 2010 by ninihome

147 adding a tooltip?

Can you add a tooltip to each image?

posted at 05:24 pm on November 14, 2010 by Ron Cooper

148 Really awesome

I just wanted to say thanks! I extended your script to provide a random image for the side and then I grabbed all the images and randomly selected their order to make a group of thumbnails. Perfect for a new webcomic facebook app I made.

Thanks again!

posted at 04:36 pm on March 5, 2011 by TyphoidMarty

149

I like this site! It’s full of educational information which are related to my works. I am glad to find it. Wink! [url=“http://garlabs.us/”]GAR Labs[/url]

posted at 03:10 pm on September 12, 2011 by khentloujohnson

150

I like this site! It’s full of educational information which are related to my works. I am glad to find it. Wink! [url=“http://garlabs.us/”]GAR Labs[/url]

posted at 03:12 pm on September 12, 2011 by khentloujohnson

Pages

« First  <  13 14 15

Got something to say?

Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.

Create a new account or sign in below if you’d like to leave a comment.

Remember me

Forgot your password?

Subscribe to this article's comments: RSS (what’s this?)