You are here: irt.org | FAQ | DHTML | Q1136 [ previous next ]
Try:
<html>
<head>
<script language="JavaScript1.2"><!--
var text = null;
function init() {
text = '<a href="javascript:void()" onMouseOver="window.status=\'\'">File<\/a><br>' +
'<a href="page1a.htm">New<\/a><br>' +
'<a href="page1b.htm">Open<\/a><br>' +
'<a href="page1c.htm">Save<\/a>';
update(1,text);
text = '<a href="javascript:void()" onMouseOver="window.status=\'\'">Edit<\/a><br>' +
'<a href="page2a.htm">Undo<\/a><br>' +
'<a href="page2b.htm">Redo<\/a><br>' +
'<a href="page2c.htm">Cut<\/a><br>' +
'<a href="page2d.htm">Copy<\/a><br>' +
'<a href="page2e.htm">Paste<\/a>';
update(2,text);
text = '<a href="javascript:void()" onMouseOver="window.status=\'\'">View<\/a><br>' +
'<a href="page3a.htm">Navigation<\/a><br>' +
'<a href="page3b.htm">Location<\/a><br>' +
'<a href="page3c.htm">Personal<\/a>';
update(3,text);
text = '<a href="javascript:void()" onMouseOver="window.status=\'\'">Go<\/a><br>' +
'<a href="page4a.htm">back<\/a><br>' +
'<a href="page4b.htm">forward<\/a><br>' +
'<a href="page4c.htm">home<\/a>';
update(4,text);
}
function update(n,text) {
if (document.all)
document.all('s' + n).innerHTML = '<table bgcolor="#cccccc" border="0" cellpadding="0" cellspacing="0"><tr><td>' + text + '<\/td><\/td><\/table>';
else if (document.layers) {
hide(n);
document.layers['l' + n].document.open();
document.layers['l' + n].document.writeln('<table bgcolor="#cccccc" border="0" cellpadding="0" cellspacing="0"><tr><td>' + text + '<\/td><\/td><\/table>');
document.layers['l' + n].document.close();
}
}
function reveal(n) {
for (var i=1;i<tabtotal+1;i++) {
if (i != n) hide(i);
else show(i);
}
}
function show(n) {
if (document.layers && document.layers['l' + n] != null)
document.layers['l' + n].visibility = 'visible';
else if (document.all)
document.all['s' + n].style.visibility = 'visible';
tab = n;
}
function hide(n) {
if (document.layers && document.layers['l' + n] != null)
document.layers['l' + n].visibility = 'hidden';
else if (document.all)
document.all['s' + n].style.visibility = 'hidden';
tab = 0;
}
var tab = 0;
var tabtotal = 4
//--></script>
<style type="text/css"><!--
.myStyle {
position: absolute;
visibility: hidden;
}
//--></style>
</head>
<body onLoad="init()" bgcolor="#ffffff">
<layer id="l1" style="position:absolute; visibility:hidden;" onMouseOut="reveal(0)"></layer><span id="s1" class="myStyle" onMouseOut="hide(1)"></span><a href="default1.htm" onMouseOver="reveal(1)">File</a>
<layer id="l2" style="position:absolute; visibility:hidden;" onMouseOut="reveal(0)"></layer><span id="s2" class="myStyle" onMouseOut="hide(2)"></span><a href="default2.htm" onMouseOver="reveal(2)">Edit</a>
<layer id="l3" style="position:absolute; visibility:hidden;" onMouseOut="reveal(0)"></layer><span id="s3" class="myStyle" onMouseOut="hide(3)"></span><a href="default3.htm" onMouseOver="reveal(3)">View</a>
<layer id="l4" style="position:absolute; visibility:hidden;" onMouseOut="reveal(0)"></layer><span id="s4" class="myStyle" onMouseOut="hide(4)"></span><a href="default4.htm" onMouseOver="reveal(4)">Go</a>
<br>
Blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
</body>
</html>