<HTML>
<HEAD>
<SCRIPT>
var topics;
var hints;
var curTopic = null;
var curHint = null;
//Change the topic background color and display a hint
function highlight() {
//Is the hint still visible? This is called if we have moved from the
//topic to the hint and then back to some other hint
if ((curHint != null) && (curHint.style.visibility == "visible")) {
curTopic.style.backgroundColor = "";
curHint.style.visibility = "hidden";
}
//Ignore movement outside the topics but in thold
if (event.srcElement.id == "topic") {
curTopic = event.srcElement;
curTopic.style.backgroundColor = "yellow";
for (i = 0; i < topics.length; i++)
if (event.srcElement == topics[i]) {
curHint = hints[i]
curHint.style.visibility = "visible"
}
}
}
//Hide the hint if we've moved on to another topic or beyond the top of the
//topic list
function unhigh() {
if ((event.toElement.id == "topic") || (event.toElement.id == "grad")) {
curHint.style.visibility = "hidden"
curTopic.style.backgroundColor = ""
}
}
//Jump to the href specified in the expando property
function jump() {
if (event.srcElement.jump)
document.location.href = event.srcElement.jump
}
//If moving over a hint anchor, highlight it.
function onHint() {
if (event.srcElement.tagName == "A")
event.srcElement.style.backgroundColor = "cyan";
}
//If moving off of a hint anchor, unhighlight it.
function offHint() {
if (event.srcElement.tagName == "A")
event.srcElement.style.backgroundColor = "";
}
function init() {
topics = document.all.item("topic");
hints = document.all.item("hint");
}
</SCRIPT>
<STYLE>
#hint {position:absolute;top:40%;visibility:hidden;background-color:yellow;font-size:14pt;font-family:arial}
</STYLE>
</HEAD>
<BODY onload="init()" topmargin=0 leftmargin=0 BGCOLOR=silver>
<DIV style="position:absolute;left:25%;width:75%;height:100%">
<DIV style="position:absolute;left:10%;top:10%;width:70%">
Welcome to the Moon site. Here you can find all of the information you need to keep
abreast of the latest Moon news.
<HR>
</DIV>
</DIV>
<H1>Moon</H1>
<DIV id=grad style="position:absolute;width:25%;height:100%;top:0;left:0;background-color:fuchsia;filter:alpha(opacity=0, finishopacity=80, style=1)">
</DIV>
<DIV style="position:absolute;top:20%;height:20%;width:28%;font-size:16pt;font-weight:bold;font-family:arial;text-align:right" onmouseover="highlight()" onmouseout="unhigh()" onclick="jump()">
<DIV id=topic>Sightings</DIV>
<DIV id=topic jump="scopes.html">Telescopes</DIV>
<DIV id=topic>Online news</DIV>
<DIV id=topic>Phases</DIV>
</DIV>
<DIV style="position:absolute;top:20%;width:20%;left:30%" onmouseover="onHint()" onmouseout="offHint()">
<DIV id=hint><A HREF="texas.html">Texas</A><BR><A HREF="no.html">New Orleans</A></DIV>
<DIV id=hint>Learn about <A HREF="scopes.html">telescopes</A> used by the professionals.</DIV>
<DIV id=hint>Is it true that the Moon is waning?</DIV>
<DIV id=hint>It's almost time for the full moon.</DIV>
</DIV>
</BODY>
</HTML>
How It's Done/Hyman
11/12/97
1:33 PM
Tidak ada komentar:
Posting Komentar