• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 275
  • Last Modified:

Random

I want to be able to use a javascript to display a random image out of a set of 4 on my web page. Anyone know the code for this?
0
Bishma
Asked:
Bishma
  • 2
  • 2
  • 2
  • +1
1 Solution
 
MasseyMCommented:
Here you go:

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
numpics = 4
day = new Date()
z = day.getTime()
y = (z - (parseInt(z/1000,10) * 1000))/10
x = parseInt(y/100*nummidi,10) + 1
if (x == (1))
pic=("pic1.gif")
if (x == (2))
pic=("pic2.gif")
if (x == (3))
pic=("pic3.gif")
if (x == (4))
pic=("pic4.gif")
document.write('<IMG SRC= ' + pic + ' >')
// End -->
</SCRIPT>

0
 
martinagCommented:
If your images are named "pic1.gif" to "pic4.gif" this:
if (x == (1))
pic=("pic1.gif")
if (x == (2))
pic=("pic2.gif")
if (x == (3))
pic=("pic3.gif")
if (x == (4))
pic=("pic4.gif")
Can be replace with this:
pic = "pic" + x + ".gif";

Martin
0
 
BishmaAuthor Commented:
It didn't work. Is there a line that should be in the body to accompany this? Keep in mind I know very little about javascript
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
GrdvCommented:
<html>
<head>
<script language="javascript">
function rand(n){
 var now = new Date();
 var seed = now.getTime() % 0xffffffff;
 seed = (0x015a4e35 * seed) % 0x7fffffff;
 return (seed >> 16) % n;
}

function splash(){
 if (document.images) document.images["splash"].src = "img/splash" + rand(4) + ".gif";
}
</script>
<title>Splash Screen Page</title>
</head>
<body bgcolor="#cccc66" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" onLoad="splash()">
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
 <tr>
  <td align="center" valign="middle" colspan="2">
    <a href="about.html">
<img src="img/bl.gif" alt="splashpicture" width="370" height="370" border="0" name="splash"></a>
  </td>
 </tr>
</table>
</body>
</html>
this is very simple... all you do is to place your pictures in a subdir, called img and then name them:
splash0.gif,splash1.gif,splash2.gif,splash3.gif

and then this image tag is the keytag:
<img src="img/bl.gif" alt="splashpicture" width="370" height="370" border="0" name="splash">
first of all the src= points to a blank image, just to have an image then the name "splash" is the one used of the javascript function splash()

if (document.images) document.images["splash"].src = "img/splash" + rand(4) + ".gif";
checks if there is possible to change the image, if it is, then change the image named "splash" into the random splash screen...

hope that helped...

//Grdv
0
 
BishmaAuthor Commented:
Not exactly what I wanted but it only took 2 small changes to get it to work. Thanks.
0
 
MasseyMCommented:
That is exactly what mine did!
0
 
GrdvCommented:
no it's not.... you're using this line:

      document.write('<IMG SRC= ' + pic + ' >')

while I'm using dynamic images, then which one of them's best can be discussed...

//Grdv
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

  • 2
  • 2
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now