"McKirahan" <Ne**@McKirahan .com> wrote in message news:<l7Kqd.118 122$5K2.23354@a ttbi_s03>...
"Dr John Stockton" <sp**@merlyn.de mon.co.uk> wrote in message
news:GL******** ******@merlyn.d emon.co.uk... JRS: In article <Nzwqd.160663$H A.32847@attbi_s 01>, dated Mon, 29 Nov
2004 03:20:18, seen in news:comp.lang. javascript, McKirahan
<Ne**@McKirahan .com> posted :
function numbers() {
var url = "http://www.topsearchsp ot.com/";
var gif = new Array(10);
gif[0] = "0.gif|Zero ";
gif[1] = "1.gif|One" ;
gif[2] = "2.gif|Two" ;
gif[3] = "3.gif|Thre e";
gif[4] = "4.gif|Four ";
gif[5] = "5.gif|Five ";
gif[6] = "6.gif|Six" ;
gif[7] = "7.gif|Seve n";
gif[8] = "8.gif|Eigh t";
gif[9] = "9.gif|Nine ";
for (var i=0; i<gif.length; i++) {
gif[i] = url + gif[i];
}
Only a list of the names of the digits is needed; javascript can
assemble the rest when needed.
var Digits = ["Zero", ..., "Nine"] // is simpler.
Simpler, yes -- but not applicable. If you had read the complete thread you
would see that my post was just an example of how to handle multiple images
and their corresponding text.
Hmm...what about those with JS disabled? Not much help...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled </title>
<!-- DEMO ONLY -->
<base href="http://i.office.micros oft.com/i/0000/MR/" />
<!-- DEMO ONLY -->
<style type="text/css">
body {
font-size: 100%;
margin: 12px;
background: #000;
}
#container {
width: 458px;
margin: 10px auto;
}
#rotator1, #rotator2 {
float: left;
margin: 10px;
border-collapse: collapse;
border: 4px #fff;
border-style: groove ridge groove groove;
background: #000;
}
#rotator1 td, #rotator2 td {
text-align: center;
padding: 1px;
margin: 0;
}
td a:link, td a:visited {
font: normal 60% verdana, sans-serif;
color: #fff;
text-decoration: none;
}
td a:hover {
text-transform: uppercase;
}
td a img {
display: block;
border-width: 0;
}
</style>
<script type="text/javascript">
//<![CDATA[
var table_ids = [ 'rotator1' , 'rotator2' ];
function Rotator(table_i d)
{
this.table = document.getEle mentById(table_ id);
this.cells = this.table.getE lementsByTagNam e('TD');
this.ncells = this.cells.leng th;
this.pix = [];
this.txt = [];
this.hrefs = [];
this.idx_array = new Array(this.ncel ls);
function read()
{
var cell, n = 0;
while (cell = this.cells.item (n++))
{
this.pix.push(c ell.getElements ByTagName('IMG' )[0].src);
this.txt.push(c ell.getElements ByTagName('A')[0].lastChild.node Value);
this.hrefs.push (cell.getElemen tsByTagName('A' )[0].href);
}
this.shuffle();
}
this.read = read;
function shuffle()
{
var idx, i, ind1, ind2, temp;
for (i = 0; i < this.ncells; ++i)
this.idx_array[i] = i;
for (i = 0; i < this.ncells; ++i)
{
ind1 = Math.floor(Math .random() * this.ncells);
ind2 = Math.floor(Math .random() * this.ncells);
temp = this.idx_array[ind1];
this.idx_array[ind1] = this.idx_array[ind2];
this.idx_array[ind2] = temp;
}
this.write();
}
this.shuffle = shuffle;
function write()
{
var cell, el, idx, n = 0;
while (cell = this.cells.item (n))
{
idx = this.idx_array[n++];
cell.getElement sByTagName('IMG ')[0].src = this.pix[idx];
(el = cell.getElement sByTagName('A')[0]).lastChild.nod eValue =
this.txt[idx];
el.href = this.hrefs[idx];
}
this.table.styl e.visibility = 'visible';
}
this.write = write;
this.read();
}
onload = function()
{
if (document.getEl ementById && document.create Element)
for (var i = 0; i < table_ids.lengt h; ++i)
new Rotator(table_i ds[i]);
}
/* set initial visibility to hidden */
if (document.getEl ementById && document.create Element)
{
for (var s = '', i = 0; i < table_ids.lengt h; ++i)
s += '#' + table_ids[i] + ',';
document.write(
'<style type="text/css">' ,
s.replace(/,$/, '') ,
'{visibility:hi dden;}' ,
'</style>'
);
}
/* demo only */
function dummy(link)
{
alert(link.href );
return false;
}
//]]>
</script>
</head>
<body>
<div id="container" >
<table id="rotator1">
<tbody>
<tr>
<td><a href="#displays " onclick="return dummy(this)"><i mg
src="j0399/j0399836.gif" />displays</a></td>
<td><a href="#diskette " onclick="return dummy(this)"><i mg
src="j0323/j0323552.gif" />diskette</a></td>
</tr>
<tr>
<td><a href="#floppies " onclick="return dummy(this)"><i mg
src="j0233/j0233109.gif" />floppies</a></td>
<td><a href="#monitor" onclick="return dummy(this)"><i mg
src="j0316/j0316344.gif" />monitor</a></td>
</tr>
<tr>
<td><a href="#mouse" onclick="return dummy(this)"><i mg
src="j0382/j0382582.gif" />mouse</a></td>
<td><a href="#dishes" onclick="return dummy(this)"><i mg
src="j0237/j0237779.gif" />dishes</a></td>
</tr>
<tr>
<td><a href="#cams" onclick="return dummy(this)"><i mg
src="j0396/j0396846.gif" />cams</a></td>
<td><a href="#pcs" onclick="return dummy(this)"><i mg
src="j0399/j0399981.gif" />pcs</a></td>
</tr>
<tr>
<td><a href="#birds" onclick="return dummy(this)"><i mg
src="j0198/j0198718.gif" />birds</a></td>
<td><a href="#recycle" onclick="return dummy(this)"><i mg
src="j0323/j0323582.gif" />recycle</a></td>
</tr>
</tbody>
</table>
<table id="rotator2">
<tbody>
<tr>
<td><a href="#kitty" onclick="return dummy(this)"><i mg
src="j0326/j0326434.gif" />kitty</a></td>
<td><a href="#kite" onclick="return dummy(this)"><i mg
src="j0231/j0231947.gif" />kite</a></td>
</tr>
<tr>
<td><a href="#telescop e" onclick="return dummy(this)"><i mg
src="j0287/j0287221.gif" />telescope</a></td>
<td><a href="#keys" onclick="return dummy(this)"><i mg
src="j0287/j0287325.gif" />keys</a></td>
</tr>
<tr>
<td><a href="#earth" onclick="return dummy(this)"><i mg
src="j0400/j0400664.gif" />earth</a></td>
<td><a href="#choo-choo" onclick="return dummy(this)"><i mg
src="j0234/j0234231.gif" />choo-choo</a></td>
</tr>
<tr>
<td><a href="#bus" onclick="return dummy(this)"><i mg
src="j0395/j0395931.gif" />bus</a></td>
<td><a href="#chips" onclick="return dummy(this)"><i mg
src="j0318/j0318944.gif" />bull !</a></td>
</tr>
<tr>
<td><a href="#shot-put" onclick="return dummy(this)"><i mg
src="j0303/j0303464.gif" />shot-put</a></td>
<td><a href="#pointer" onclick="return dummy(this)"><i mg
src="j0281/j0281730.gif" />pointer</a></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
