// LINK WRITER VERSION 2.0 - FOR NETSCAPE AND IE BROWSERS VERSION 4 AND UP.
// BY: BRIAN GOSSELIN


// ENTER LINK DATA HERE. EACH LINE CONTAINS ONE SUB-ARRAY FOR EACH LINK.
// FORMAT: [ 'Link picture' , 'Text to appear under link' , 'Link target' ]
// USE COMMAS AFTER EACH SUB-ARRAY EXCEPT THE LAST ONE.

var linkslist=[
[ 'page1.gif' , '<font size="2">Design Sets</font>' , 'http://jdstiles.com/sets/' ],
[ 'page2.gif' , '<font size="2">Javascripts</font>' , 'http://jdstiles.com/javamain.html' ],
[ 'page3.gif' , '<font size="2">Developer Tools</font>' , 'http://jdstiles.com/java/101.html' ],
[ 'page4.gif' , '<font size="2">Office Tips</font>' , 'http://jdstiles.com/jds.main_office.html' ]
]

var boxcolor="#006bae";                 // TEXTBOX BACKGROUND COLOR.
var textcolor="white";                       // TEXT COLOR
var imgwidth=60;                               // IMAGE WIDTH IN PIXELS (THE HEIGHT AUTOMATICALLY ADJUSTS).
var defstatus='Welcome to my Website!';      // STATUS AREA MESSAGE WHEN NOT HOVERING ON A LINK

var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var txt='';
var widthval= (imgwidth>120) ? imgwidth*linkslist.length : imgwidth*linkslist.length+(240-(imgwidth*2)) ;
var Tids=new Array();

function mousehover(num,ishover){
if(ishover){
if(ns4){
Tids[num].moveTo(num*imgwidth+Math.abs((imgwidth-120)/2),0);
Tids[num].visibility="show";
}else{
Tids[num].style.left=(num*imgwidth+Math.abs((imgwidth-120)/2))+'px';
Tids[num].style.top='0px';
Tids[num].style.visibility="visible";
}}else{
if(ns4) Tids[num].visibility="hide";
else Tids[num].style.visibility="hidden";
}}

function getid(id){
if(ns4) return findlayer(id,document);
else if(ie4)return document.all[id];
else return document.getElementById(id);
}

// FUNCTION TO FIND NESTED LAYERS IN NS4 BY MIKE HALL
function findlayer(name,doc){
var i,layer;
for(i=0;i<doc.layers.length;i++){
layer=doc.layers[i];
if(layer.name==name)return layer;
if(layer.document.layers.length>0)if((layer=findlayer(name,layer.document))!=null)return layer;
}
return null;
}

window.onload=function(){
for(i=0;i<linkslist.length;i++)Tids[i]=getid('txt'+i);
}

txt+='<table cellspacing="0" cellpadding="0"><tr><td nowrap align="center" width="'+widthval+'">';
for(i=0;i<linkslist.length;i++){
txt+='<a href="'+linkslist[i][2]+'" ';
txt+='onMouseover="mousehover('+i+',true); return true"';
txt+='onMouseout="mousehover('+i+',false)">';
txt+='<img src="'+linkslist[i][0]+'" border="0" width="'+imgwidth+'"></a>';
}
txt+='</td></tr><tr height="1"><td>&nbsp;</td></tr><tr><td>';
txt+=(ns4)? '<ilayer name="outer" visiblity="visible" width="'+widthval+'">' : '<div style="position:relative; visibility:visible; left:0px; top:0px">' ;
for(i=0;i<linkslist.length;i++)txt+=(ns4)? '<layer name="txt'+i+'" visibility="hidden" bgcolor="'+boxcolor+'" width="120"><center><b><font color="'+textcolor+'">'+linkslist[i][1]+'</font></b></center></layer>' : '<div id="txt'+i+'" style="position:absolute; visibility:hidden; color:'+textcolor+'; width:120px; background:'+boxcolor+'; font-weight:bold; left:0px; top:0px"><center>'+linkslist[i][1]+'</center></div>';
txt+=(ns4)? '</ilayer>' : '</div>' ;
txt+='</td></tr></table>';
document.write(txt);