Welcome to Dream.In.Code
Become an Expert!

Join 149,432 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 2,303 people online right now. Registration is fast and FREE... Join Now!




Random Background Builder

 
Reply to this topicStart new topic

Random Background Builder, Using CSS to stack a set of gif layers

JackSauce
29 Jul, 2007 - 01:15 AM
Post #1

New D.I.C Head
*

Joined: 28 Jul, 2007
Posts: 1


My Contributions
Hi there

I am a complete idiot when it comes to coding, in fact when it comes to anything technical on the computer. Photoshop I can do, Illustrator; great, Ableton Live etc.

However I have got an idea that I need some technical advice to implement, and being an artist, not a technician, I have come here.

The idea is that I have a selection of say, 10 gif patterns, which all have transparent elements. 4 are selected at random, and are layered up one by one as the background to a website. Thus each time the user enters, the site looks slightly different.

Further to this, would it be possible to scale/rotate/colourise the gif elements (randomly), thereby creating an almost infinite array of possibilities.

I anyone else excited by this idea?

This sort of thing is the basis of my work in RL. I work a lot with lots of layers as a collage artist, constantly evolving and building things up. This idea is for my Artist website.

Ideally, I was looking for someone that I could perhaps collaborate with, or that would participate in a skills exchange (as I said before I am great with PS so logos, banners, BGs, etc I can do). But if not then fine. smile.gif

I found this on Dream.in.code which might be a useful start.

CODE


<?
$array = array(
'Element 1',
'Element 2',
"Element 3"
);

$numbers = array();
$rand = rand(0, count($array)-1);

function getrand($rand, $numbers, $array) {
    while (in_array($rand, $numbers)) $rand = rand(0,count($array)-1);
    return $rand;
}

for($i=0; $i<=count($array)-1; $i++) {
    $n = getrand($rand, $numbers, $array);
    array_push($numbers, $n);
    echo $array[$n];
}
?>


Thanks

Saucy Jack
User is offlineProfile CardPM
+Quote Post

eddieboy665
RE: Random Background Builder
29 Jul, 2007 - 11:23 AM
Post #2

D.I.C Head
**

Joined: 9 Apr, 2007
Posts: 74



Thanked: 1 times
My Contributions
Hiya,

If I understood it right i guess you are looking to have something like 4 divs with opactiy set to a certain number (or png transparet images) and layer them ontop of each other in various orders and inchanging the pictures randomly.

I believe you can do all that in javaScript reasonably easily.

If you create the divs by creating one class that is the full width and height of the page and in HTML open 4 divs and asssign each one a different ID, putting all content inbetween them. Then with javascript add onload event calls to functions that randomly determine the images to use for the background of the 4 different div IDs.

I am not sure about changing things like the scale if you did it using divs with background images and have no idea if you can reflect or rotate the images, doubt you can in CCS2 but someone else will know for sure!

If thats the kind of thing you wanted and you didn't know where to start I could have a go at some of the code but I am only a begginer(ish) so others may be able to think of a better way of doing it!

Ed
User is offlineProfile CardPM
+Quote Post

Fast ReplyReply to this topicStart new topic
Time is now: 1/7/09 11:58AM

Be Social

Dream.In.Code RSS Feed Dream.In.Code LinkedIn Group Follow Us On Twitter

Live Help!

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

DIC Chatroom

Bye Bye Ads

Monthly Drawing

Thumb Drive

Top Contributors

Top 10 Kudos This Month