|
|
description menu
This is a good way to add some surprising functionality to your links. You can link to anything in a different document or to a place within the current document as provided by the attributes you use within the anchor tag. Links may be relative or absolutely stated. CSS rules that apply to a normal link apply and are given in the HEAD of the document.
We use the getElementById() method to access the properties of the anchor tag, in this case to assign the locations and other attributes of the links.
<html>
<head>
<style>
Table {
background:black;
}
a {
text-decoration:none;
color:#000000;
}
th {
width:150px;
background:#FF8080;
}
td {
font:bold;
background:#ADD8E6;
}
</style>
<script type="text/javascript">
function get(txt) {
document.getElementById('tip').innerHTML=txt;
}
function reset() {
document.getElementById('tip').innerHTML=" ";
}
</script>
</head>
<body>
<table width="400">
<tr>
<td><a href="page.html" onmouseover="get(‘Description')" onmouseout="reset()">Item One</a></td>
<td rowspan="3" id="tip"></td>
</tr><tr>
<td>
<a href="page.html" onmouseover="get(‘Description’)" onmouseout="reset()">Item Two</a></td>
</tr><tr>
<td><a href="page.html" onmouseover="get(‘Description)" onmouseout="reset()">Item Three</a></td>
</tr>
</table>
</body>
</html>
I’ve put the links in a table, but they don’t have to be. You can place them anywhere you like using any method you like. As long as they’re able to be rendered by the browser.
|
|
