...

View Full Version : Tiled Background with each tile a random image



Radscientist
02-25-2012, 05:33 PM
How would I go about making a 75x75px tiled background with which each tiles is an image randomly picked from one folder?

I currently have one large background image that randomly draws from ten images in a folder. I am hoping to do the tiled image so a visitor could see more of my works and be more encouraged to click through to my portfolio for the bigger images and more.

I have a randombg.php

<?php
header("Content-type: image/jpeg");
header("location:".'images/bg/bg_'.rand(1,10).'.jpg');
?>

and in my CSS, it is...

body {
background:#0facea url(randombg.php) no-repeat;
background-position:center;
background-color:#34454F;
background-attachment:fixed;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

Could I just remove "background-attachment:fixed;" and change the "no-repeat" to "repeat"?

I think that this would only make a tiled background of the one single random image rather than a tile of multiple random images.

what do I need to do?

KuriosJon
02-27-2012, 12:00 PM
Well, CSS 2 only lets you have a single background on any given page. I can think of a few options:


Make a huge table in the background of your web site (everything else will have to sit on top of this table) and use PHP to drop random images in each cell. Wouldn't be that hard but you have to make the table at least as big as the maximum browser size you want to support. Then you would have to use position: fixed so it doesn't move. I don't really recommend this.
Create a few 5x5 tilesets or something and then use PHP to randomly select one of them. Tile that as your background image. That way you get more images and don't have to load a ton of images when your site loads.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum