Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Nov 2006
    Washington, DC
    Thanked 0 Times in 0 Posts

    Exclamation Tiled Background with each tile a random image

    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 Code:
    ("Content-type: image/jpeg");
    and in my CSS, it is...
    body {
    background:#0facea url(randombg.php) no-repeat;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    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?

  • #2
    Regular Coder
    Join Date
    Jan 2012
    Thanked 32 Times in 32 Posts
    Well, CSS 2 only lets you have a single background on any given page. I can think of a few options:

    1. 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.
    2. 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.


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts