3.6.05

Something meaningful

Ok, now for something more than just – hey this is cool.

I’ve been looking at some JavaScript lately and here are some things I have been using.

It turns out that the &lt;select&gt;/<options&gt; tags don’t support tool tips, not only that they don’t support JavaScript events either – how stupid. So I’ve created a list of links nested inside a div that does the same thing – have a look:

//JavaScript

Var listLengths = new Array();

function drawList(){
var linkText = new Array();
linkText[0] = “this is a load of text”;
var div = getElementById(‘divList’);
div.innerHTML = “&lt;ul id=’itemList’&gt;”;
for(var i=0;i<linkText.length;i++){
var tempSplit = new Array();
tempSplit = linkText[i];
linkText[i] = tempSplit.join(' ');
div.innerHTML += "&lt;li><a id=’list~”+ i +”’ href=’about:blank’ title=’”+ linkText[i] +”’ onClick=’listClick(\”itemList\”, \”list~” + i +”); return false;’&gt;”+ linkText[i] +”</a></li>
}

div.innerHTML += “&lt;/ul>”;
listLengths['itemList'] = linkText.length;

}

function listClick(listName, link){
For(var i=0;i&lt;listLengths[listName];i++){
Document.getElementById(link.split('~')[0]+ '~' + i).style.backgroundColor = ‘#FFF’;
}
document.getElementById(link).style.backgroundColor = '#c0c0c0';
return false;
}

//styles

.thisDiv {
overflow:auto;
background-color:#FFF;
width:200px;
height:200px
border-style:solid;
border-width:1px;
margin:0 5px 0 0;
}

.thisDiv ul {
padding:5 5 0 10;
margin:0 0 0 0;
}

.thisDiv a {
text-decoration:none;
color:Black;
}

.thisDiv a:visited {
text-decoration:none;
color:Black;
}

.thisDiv li {
list-style:none;
}

//HTML

I’m pretty sure this works, its from something that does, so if it doesn’t… well it shouldn’t take too long to get going!

No comments: