need a Simple Script

Forum Moderators: open

Message Too Old, No Replies

need a Simple Script

Change background

blankmonkey

1:38 am on Jan 12, 2008 (gmt 0)

This seems like it would be simple, but I can't find an example anywhere. Could someone help with an example that will change the background of the entire webpage, either random or orderly? Everytime I hit refresh it will show a differant background.

lavazza

1:58 am on Jan 12, 2008 (gmt 0)

You ought to find a few helpful pointers amongst the first few results at Google: Results 1 - 10 of about 2,270 for "Random Image Rotation" [google.com]

Fotiman

3:17 am on Jan 12, 2008 (gmt 0)

Here's one way you could do it using the Yahoo UI Library [com3.devnet.re3.yahoo.com]:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
 "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<style type="text/css"> 
 #container { 
background-color: #fff; 
} 
</style> 
<title>Untitled</title> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.4.1/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
<script type="text/javascript"> 
YAHOO.util.Event.on(window, 'load', function() { 
 function d2h(d) {return d.toString(16);} 
 // Generate a random background color 
 var rgb = '#' + d2h(Math.round(255*Math.random())) + '' + 
  d2h(Math.round(255*Math.random())) + '' +  
  d2h(Math.round(255*Math.random())); 
 YAHOO.util.Dom.setStyle(document.body, 'background-color', rgb); 
 alert('Set the background color to: ' + rgb); 
}); 
</script> 
</head> 
<body> 
<div id="container"> 
Here's my page 
</div> 
</body> 
</html>

[edited by: Fotiman at 3:30 am (utc) on Jan. 12, 2008]

blankmonkey

5:07 pm on Jan 14, 2008 (gmt 0)

you guys rock, TY so much, I will check these out today :)

blankmonkey

11:55 pm on Jan 14, 2008 (gmt 0)

Ty again guys;

lavazza,
This is similar to what I need, but I need the background to be random, not just a spcific image.

Fotiman,
This is almost what I need, but I want it to ba an image, and not a color, not sure how to modify this to take file names, and not numbers.

Again, thanks for your input guys :)

Fotiman

5:07 pm on Jan 15, 2008 (gmt 0)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
 "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<style type="text/css"> 
#container {  
  background-color: #fff;  
} 
</style>  
<title>Untitled</title>  
<script type="text/javascript" src="http://yui.yahooapis.com/2.4.1/build/yahoo-dom-event/yahoo-dom-event.js"></script>  
<script type="text/javascript">  
YAHOO.util.Event.on(window, 'load', function() {  
  // Choose a random background image 
  var bgimgs = [ 
    'image1.jpg', 
    'image2.jpg', 
    'image3.jpg' 
  ]; 
  var idx = Math.round(bgimgs.length * Math.random()); 
  YAHOO.util.Dom.setStyle(document.body, 'background-image', bgimgs[idx]);  
  alert('Set the background image to: ' + bgimgs[idx]);  
});  
</script>  
</head>  
<body>  
<div id="container">  
Here's my page  
</div>  
</body>  
</html>

[edited by: Fotiman at 5:47 pm (utc) on Jan. 15, 2008]

blankmonkey

7:21 pm on Jan 29, 2008 (gmt 0)

Fotimon,

Ty so much for your reply, and sorry about my delay. I haven't had a chance to get back to this yet, but I will get this working aap. TY again for your effort :)