Found this at:
http://www.experts-exchange.com/Prog..._22928024.html
I have table on a web page that is displaying 7 different images, what I need to do is to somehow randomize the position of where each image is displayed within the table each time the page loads so that there is not one preference.
I need the 7 images to appear on the page at all times, I've had a scout around the web for a script but haven't found one that displays the 7 seven images each time.
this should work:
Code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Randomize Images Location</title>
<style type="text/css">
<!--
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}
-->
</style>
<script type="text/javascript">
var imgs = new Array();
imgs.push("Image1.jpg");
imgs.push("Image2.jpg");
imgs.push("Image3.jpg");
imgs.push("Image4.jpg");
imgs.push("Image5.jpg");
imgs.push("Image6.jpg");
imgs.push("Image7.jpg");
function rndmImg(root)
{
var tmpArry = imgs.concat();
var pics = root.getElementsByTagName("img");
var len = imgs.length;
for(var i=0; i<len; i++)
{
var rnd = Math.floor(Math.random()*tmpArry.length);
pics.src = tmpArry.splice(rnd,1);
}
}
</script>
</head>
<body onload="rndmImg(document.getElementsByTagName('table')[0]);">
Randomize Images Location
<table width="600" border="1">
<tr>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img width="120" height="92" border="0" /></th>
<th scope="col"><img src="Image7.jpg" width="120" height="92" /></th>
</tr>
</table>
</body>
</html>
Excellent thanks
basicinstinct works a charm.
Haven't tried it but maybe it's a start. If you get it working it would be great if you could zip and post a sample!
Reply With Quote