|
|
Menus
Описание: Меню
Скрипт:<![CDATA[
<HTML>
<HEAD>
<TITLE>Pop-Up Menu</TITLE>
<STYLE TYPE="text/css">
/* Make the menu float to the left of the text. */
#menu {float:left; width:50pt; background:lightgrey;
border:2px white outset; cursor:default}
/* Hide the pop-up menus initially. */
#menu .popup {position:absolute; display:none;
background:lightgrey; border:2px white outset;
width:135pt; margin:2pt}
#menu P {margin-top:0pt; margin-bottom:0pt}
.over {color:navy; font-weight:bold}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
var curPop = null;
function clearCurrent() {
// Hide the pop-up menu that is currently displayed.
if (null != curPop)
curPop.style.display = "";
curPop = null;
}
function popup() {
var el = event.srcElement;
clearCurrent();
// Display a new menu option.
if (("P" == el.tagName) &&
("menu" == el.parentElement.id)) {
// Position and display the pop-up menu.
var elpop = document.all[el.sourceIndex + 1];
elpop.style.pixelLeft = document.all.menu.offsetLeft +
document.all.menu.offsetWidth - 7;
elpop.style.pixelTop = el.offsetTop +
document.all.menu.offsetTop;
elpop.style.display = "block";
curPop = elpop;
}
event.cancelBubble = true;
}
function highlight() {
// Highlight the menu options.
if (null != event.fromElement)
if ((event.fromElement.tagName == "P") &&
(event.fromElement.parentElement.id == "menu"))
event.fromElement.className = "";
if (null != event.toElement)
if ((event.toElement.tagName == "P") &&
(event.toElement.parentElement.id == "menu"))
event.toElement.className = "over";
}
</SCRIPT>
</HEAD>
<BODY ONCLICK="clearCurrent()">
<H1>Menu Example</H1>
<DIV ID="menu" ONCLICK="popup()" ONMOUSEOVER="highlight()"
ONMOUSEOUT="highlight()">
<P>Navigate
<DIV CLASS="popup">
<P><A HREF="http://kopeck.4u.ru">Home</A>
<P><A HREF="http://kopeck.4u.ru">Home too
</A>
<P><A HREF="http://kopeck.chat.ru">Mirror</A>
</DIV>
<P>Programs
<DIV CLASS="popup">
<P><A HREF="../program/index.html">Java Programs</A>
<P><A HREF="index.html">JavaScript</A>
</DIV>
</DIV>
<P>Click on a menu option in the box on the left.</P>
<!-- copyright (t2) --><div align="center">Сайт создан в системе <a href="http://www.ucoz.ru/" title="Создать сайт бесплатно">uCoz</a><br /></div><!-- /copyright -->
</body>
</html>
]]>
| |
|
