Banner

Sponsor

Login

Welcome Back!
Guest
Guest

Register

Lost your password?

89 users online

ramdom bg images

ramdom bg images

Forums » Web Development » Client Side - HTML/Javascript/etc. » ramdom bg images

Currently viewing this thread: 1 (0 members and 1 guests)

#1
Old Post October 21st, 2003 09:14 PM
Machoscrawn

Machoscrawn

Neverside Newbie
Status: Offline!

ramdom bg images

Hey, does anybody know how those random backgrounds work. like... Surfstation mabye someone nows where i can find a tutorial explaining how to do it. Thank you. Smile

___________________

m a c h o s c r a w n

#2
Old Post October 21st, 2003 09:48 PM
sparky

sparky

I need a haircut
Status: Offline!

i recommend doing it in PHP, i have a tutorial on my site that talks about randomization: http://www.brilla.org

but here's a quick solution in javascript:

<script>
var bg = new Array();

bg[0] = "bahooboris.gif";
bg[1] = "gator.gif";
bg[2] = "seniors.gif";

// what have you...

var num = Math.round(Math.random() * (bg.length - 1));

document.write("<style>body{ background-image: url(" + bg[num] + "); } </style>")

</script>

___________________

Jon Culver Chia Pets

#3
Old Post November 3rd, 2003 03:44 PM
Machoscrawn

Machoscrawn

Neverside Newbie
Status: Offline!

thanks alot sparky thats exactly what i needed. Smile

___________________

m a c h o s c r a w n

#4
Old Post November 3rd, 2003 04:15 PM
fredmv

fredmv

Status: Offline!

An alternative approach:

Code:

[size=1]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>untitled</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<script type="text/javascript">
//<![CDATA[
onload = function()
{
var img = ["image1.jpg", "image2.jpg", "image3.jpg"];
document.body.style.backgroundImage = "url(" + img[Math.floor(Math.random()*img.length)] + ")";
}
//]]>
</script>
</head>
<body></body>
</html>[/size]

___________________

http://home.comcast.net/~fredv4/tf/firefox.gif

#5
Old Post November 3rd, 2003 07:19 PM
Rad

Rad

thinking of something witty to put here
Status: Offline!

The best way:

Code:


<?php
$bgimages = array("bg1.gif", "bg2.gif", "bg3.gif");
mt_srand((double)microtime()*1234567);
$n = mt_rand(0, ($bgimages)-1);
$image = $bgimages[$n];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Random BG</title>
<style type="text/css">
/* <![CDATA[ */
background-image: url(<?php echo $image;?>);
/* ]]> */
</style>
</head>
<body>
</body>
</html>

works in all browsers regardless if javascript is off

#6
Old Post November 3rd, 2003 07:21 PM
fredmv

fredmv

Status: Offline!
Quote:

Originally posted by Radley
works in all browsers regardless if javascript is off


True, but remember: this is the client-side forum. :mrcool

___________________

http://home.comcast.net/~fredv4/tf/firefox.gif

#7
Old Post November 3rd, 2003 07:31 PM
Rad

Rad

thinking of something witty to put here
Status: Offline!

Well its a client side question, and I provided the best answer, which happens to be server side. If someone asks a client side question but the best answer is server side am i supposed to make a new thread in the server side forum saying that that answer is the best.

#8
Old Post November 3rd, 2003 08:40 PM
sparky

sparky

I need a haircut
Status: Offline!

FIGHT!!! ::angry::

___________________

Jon Culver Chia Pets

Quick Jump:

Main Navigation

Site & Graphic Design by Aeon Tan
Developed by Jeremie Pelletier & Scott Roach

NeverAPI generated this page in 0.0082 seconds.