Hi all -- I need to put a table w/ 4 cells (across) to display recommended/suggested items. I want them to all be random each time someone visits or refreshes, I will have a current pool of about a dozen images to be pulled from..
I have found the code below, I edited it to be 4 td cells from one, however, as expected, it only pulls the same image randomly into all 4. I would like 4 separate ones.
Can anyone help me to edit this further to call in 4 different random images in the 4 cells? Do I need to have, for example: td.title1 title2 title3 title4 in the css? Thank you in advance.
<head>
<meta http-equiv='Content-Type' content='text/html;charset=ISO-8859-1'>
<title><%WindowTitle%></title>
<style type='text/css'>
td.title {
height: 150px;
width: 160px;
padding: 10px;
border: 3px solid #666666;
border-top: none;
vertical-align: bottom;
}
</style>
<script language="JavaScript" type="text/javascript"><!--
var image = new Array();
image[0] = 'http://i48.photobucket.com/albums/f227/wasaaaaa/1.jpg' ;
image[1] = 'http://i48.photobucket.com/albums/f227/wasaaaaa/2.jpg' ;
image[2] = 'http://i48.photobucket.com/albums/f227/wasaaaaa/3.jpg' ;
image[3] = 'http://i48.photobucket.com/albums/f227/wasaaaaa/4.jpg' ;
image[4] = 'http://i48.photobucket.com/albums/f227/wasaaaaa/5.jpg' ;
var index = Math.floor(Math.random() * image.length);
document.write('<style type="text/css"> td.title { background-image: url('+ image[index] +') } </style>');
//-->
</script>
</head>
<body>
<table width='550' cellpadding='0' cellspacing='0'>
<tr><td class='title' colspan='2'><h1><%Title%> </h1></td>
<td class='title' colspan='2'><h1><%Title%> </h1></td>
<td class='title' colspan='2'><h1><%Title%> </h1></td>
<td class='title' colspan='2'><h1><%Title%> </h1></td></tr>
<tr>
<td class='leftside' width='550' valign='top'>
<!-- BEGIN LEFT SIDE -->
</td></tr></table>
</body>