A while ago I posted a solution for generating CSS random background images, which provided a PHP server side solution for adding random background images to stylesheets on the fly.
Since it's initial posting the solution provided there has been tweaked and fine tuned based on use and reader feedback. A lot of the feedback and comments were about the inability for readers to use that particular solution because they did not have access to modify the PHP source code. One such example is that of Bloggers, who have access to the Blogger templating system, but not the code.
In response to this feedback I have put together a free random background image script generator tool, which will generate a self contained block of Javascript which can be pasted into any template or web page, to provide random background image selection and application to a single element on that page.
Comments and feedback are encouraged, as are links from any sites that may find a use for the script!
-
Very useful tool! it allowed me to have randomly generated images on my website in a snap…(less than 5 minutes). Now I just need a better site!
-rgf
-
Hi there
Loved your generator, only problem is I discovered that the code doesn't work in safari or netscape
Have I done something wrong?
or is there a fix for that?-Jez
-
Hi, I love the script generator, its easy and clean ,
-
Hi!the script works fine on Internet Explorer but in Firefox its not working why?
Tnx! -
Thanks for the script. Works like a charm in IE7, Safari 4 Beta and Firefox 3.
-
Will this work on the iPhone?
-
It will work when viewed in Safari on the iPhone, yes.
-
-
I don't actually see the generator, just the page for it. Is it down?
-
Hi Levi – the generator script should be back up now. Thanks for letting me know there was a problem.
-
-
Hi, I couldn't get the PHP solution to work either, but probably more through ineptitude…!
However, this Javascript version seemed to work a treat and the images started rotating through as required.
My problem is the images all had to be 1680px wide (!) as I can't get the images to center in a centred (Wordpress) design. These rotating images are meant to fill the ID #topheader – this already had a bunch of selectors as follows:
#topheader
{ background: url(images/371.jpg) repeat-x;
width: 100%;
height:300px;
float:left;
border-bottom: 1px solid #444; }I changed 'repeat-x' to 'no-repeat top center' – but 1024px or 1280px images are firmly stuck to the top left of the screen.
So functionality, great! Styling, errm something wrong.
any ideas how to remedy this?
thanks
Hugh -
Hold your horses…I've got it!!………didn't notice the css selctors in the output script, fixed it there!
Works a dream for me!! Many thanks, just what I needed.
Hugh
-
Worked great. I used it for the photography page to show random photos. I want to have the background images (the field and the space blur) to change randomly on each page. How do I set this code into the actual background page?
-
Hi Dave, this script is developed to specifically display a single random image on page load.
I would suggest you look into using the jQuery Javascript framework on your site along with one of the many image gallery/slideshow plug ins that are available for it.
-
-
thanks! i will for sure
-
It won't show up in safari 4.0.2 or my firefox for me. Not sure why
16 comments
Comments feed for this article
Trackback link: http://www.thought-after.com/2007/08/free-random-background-image-script-tool/trackback/