Below is code... Thanks for your help.
[HTML]<HTML>
<Head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<style type="text/css">
.tableExample{b order-collapse: collapse; border: 0px solid black;}//code helped by unknown source on codingforums.co m
.tableExample tr td{cursor:point er; border: 0px solid black; padding: 0px;}
.odd{background-color:#F5DEB3'; }
.even{backgroun d-color:#F5DEB3'; }
.high{backgroun d-color:#FFFF00;f ont-size:medium;fon t-weight:bold;pos ition:static;}
.selected{backg round-color:#FFFF00;f ont-size:medium;fon t-weight:bold;}
</style>
<script type="text/javascript">
var table1 = null;
window.onload = function(){
table1 = new table.Selectabl eLSPEC("tableEx ample1",true)
}
var table = {};
table.keys = {
AddNew : function(id,act ion){
this.monitorAct ions[id] = action;
this.quickLooku p.push(id);
},
monitorActions : new Array(),
quickLookup : new Array()
}
table.ActiveTab le = null;
table.Selectabl eLSPEC = function(tableI d,activate){
var ref = this;
this.tableId = tableId;
this._init();
this.selectedId = null;
table.keys.AddN ew(tableId,ref) ;
if(activate){
table.ActiveTab le = tableId;
this.selectFirs t();
}
}
table.Selectabl eLSPEC.prototyp e._init = function(){
var ref = this;
var elemTable = document.getEle mentById(this.t ableId);
var rows = elemTable.getEl ementsByTagName ("tr");
var cnt = rows.length;
for(var i=0; i<cnt;i++){
var className = (i%2)?"odd":"ev en";
rows[i].className = className;
rows[i].defaultClassNa me = className;
rows[i].onmouseover = function(){if(t his.className!= "selected")this .className="hig h";}
rows[i].onmouseout = function(){if(t his.className!= "selected")this .className=this .defaultClassNa me;}
rows[i].onclick = function(){ref. select(this)};
}
elemTable = null;rows=null;
}
table.Selectabl eLSPEC.prototyp e.select = function(elem){
this.removeSlec tions();
this.selectedId = (this.selectedI d!=elem.id)?ele m.id:null;
if(this.selecte dId!=null)elem. className = "selected";
}
table.Selectabl eLSPEC.prototyp e.removeSlectio ns = function(elem){
var elemTable = document.getEle mentById(this.t ableId);
var rows = elemTable.getEl ementsByTagName ("tr");
var cnt = rows.length;
for(var i=0; i<cnt;i++)rows[i].className = rows[i].defaultClassNa me;
elemTable=null; rows=null;
}
table.Selectabl eLSPEC.prototyp e.selectFirst = function(){
var elemTable = document.getEle mentById(this.t ableId);
var firstRow = elemTable.getEl ementsByTagName ("tr")[0];
firstRow.classN ame = "selected"
this.selectedId = firstRow.id;
elemTable=null; firstRow=null;
}
table.Selectabl eLSPEC.prototyp e.keyClick = function(keyCod e){
var direction = (keyCode==38)?-1:(keyCode==40) ?1:0;
if(direction!=0 ){
this.selectNext (direction);
}
}
table.Selectabl eLSPEC.prototyp e.selectNext = function(dir){
var elemTable = document.getEle mentById(this.t ableId);
var rows = elemTable.getEl ementsByTagName ("tr");
var cnt = rows.length;
var hasSelection = false;
for(var i=0; i<cnt;i++){
if(rows[i].className == "selected") {
if((dir==-1 && i>0) || (dir==1 && i+1<cnt)){
rows[i].className = rows[i].defaultClassNa me;
rows[i+dir].className = "selected";
this.selectedId = rows[i+dir].id;
}
hasSelection = true;
break;
}
}
elemTable=null; rows=null;
}
function monitorClick(e) {
var evt = (e)?e:event;
var theElem = (evt.srcElement )?evt.srcElemen t:evt.target;
while(theElem!= null){
if(table.keys.q uickLookup.inde xOf(theElem.id) != -1){
table.ActiveTab le = theElem.id;
return true;
}
theElem = theElem.offsetP arent;
}
table.ActiveTab le = null;
return true;
}
function handleKeyPress( e){
var keycode;
if (window.event) keycode = window.event.ke yCode;
else if (e) keycode = e.which;
if(table.Active Table){
table.keys.moni torActions[table.ActiveTab le].keyClick(keyco de);
}
}
document.onclic k = monitorClick;
document.onkeyd own = handleKeyPress;
</script>
</head>
<body style='backgrou nd-color: #F5DEB3' class='BlackFon t'>
<table class="tableExa mple" id="tableExampl e1">
<tr id="i2_0"><td>. ............... ............... ............... ............... ...........<br> </td></tr>
<tr id="i3_0"><td>. .............He llo World.......Hel lo World......Hell o World.......<br ></td></tr>
<tr id="i4_0"><td>. .............He llo World.......... ............... ............... ........<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr id="i6_0"><td>" You are today where your thoughts have brought you, and you will be tomorrow where you thoughts take you" by James Allen<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr id="i8_0"><td>" Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr id="i9_0"><td>" Work long play hard" UNKNOWN<br></td></tr>
<tr id="i10_0"><td> Javascript is fun<br></td></tr>
<tr id="i11_0"><td> "You are today where your thoughts have brought you, and you will be tomorrow where you thoughts take you" by James Allen<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr id="i13_0"><td> "Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr id="i14_0"><td> "Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr id="i15_0"><td> "Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr id="i16_0"><td> "Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr id="i17_0"><td> "Nothing limits achievement like small thinking, and nothign expands possibilities like unleashed thinking" by William Arthur Ward<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr id="i18_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i19_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i20_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i21_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i22_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i23_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i24_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i25_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr id="i26_0"><td> Work long play hard" UNKNOWN<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td> < br></td></tr>
<tr> <br ></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td> & nbsp; .... ............... ............... ............... ............... ..<br></td></tr>
<tr><td> & nbsp;<br></td></tr>
<br>
<tr><td> < br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
<tr><td>....... ............... ............... ............... ............... .....<br></td></tr>
</table>
</BODY>
</HTML>[/HTML]
8
