<body bgColor=#ffffff link="#008000">
<p>
<CENTER>
<BUTTON onClick="popup1.style.visibility='visible';makeActive(popup1)">КЛАЦ 1</BUTTON>
<BUTTON onClick="popup2.style.visibility='visible';makeActive(popup2)">КЛАЦ 2</BUTTON>
</center>
<DIV ID=popup1
STYLE="position:absolute;
visibility:hidden;
left:190;top:90;
width:312px;height:180;
border:2px threedhighlight outset;
background-color:#ffcb00;
font-family:MS Sans Serif;font-size:8pt;
cursor:default"
onSelectStart="return false"
onMouseDown="makeActive(this)">
<DIV
STYLE="position:absolute;
left:0;top:0;
width:100%;height:100%;
border:1px inactiveborder solid">
</DIV>
<DIV
STYLE="position:absolute;
left:2;top:2;
width:304px;height:18px;
background-color:inactivecaption;
color:inactivecaptiontext;
font-family:MS Sans Serif;
font-size:9pt;font-weight:bold;
padding:2px"
onMouseDown="grabEl(this.offsetParent)">
Привет! Пользователь FORUCOZ.COM
</DIV>
<DIV
STYLE="position:absolute;
left:2;top:21;
width:304px;height:18px;
background-color:#ffe06b;
color:menutext;
font-family:MS Sans Serif;font-size:8pt;"><SPAN ID="span1"
STYLE="height:18px;width:40px;padding-top:2"
onMouseDown="setMenu(this)"> Menu1 </SPAN><SPAN ID="span2"
STYLE="height:18px;width:40px;padding-top:2"
onMouseDown="setMenu(this)"> Menu2 </SPAN><SPAN ID="span3"
STYLE="height:18px;width:40px;padding-top:2"
onMouseDown="setMenu(this)"> Menu3 </SPAN></DIV>
<HR STYLE="position:relative;top:40;width:100%">
<DIV ID=menu2 STYLE="position:absolute; visibility:hidden; top:39;left:0; width:100px; border:2px threedhighlight outset; background-color:menu; font-family:MS Sans Serif;font-size:8pt; color:menutext; line-height:160%; z-index:10;">
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 1</SPAN><BR>
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 2</SPAN><BR>
</DIV>
<DIV ID=menu3 STYLE="position:absolute; visibility:hidden; top:39;left:0; width:100px; border:2px threedhighlight outset; background-color:menu; font-family:MS Sans Serif;font-size:8pt; color:menutext; line-height:160%; z-index:10;">
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 1</SPAN><BR>
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 2</SPAN><BR>
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 3</SPAN><BR>
<SPAN STYLE="width:100%;padding-left:10px" onMouseOver="this.style.backgroundColor='highlight';this.style.color='highlighttext'" onMouseOut="this.style.backgroundColor='menu';this.style.color='menutext'" onMouseDown="maches()">Link 4</SPAN><BR>
</DIV>
<DIV STYLE="position:absolute; left:3;top:53; color:windowtext">
Ваш текст.
</DIV>
<CENTER>
<BUTTON
STYLE="position:absolute;
top:145;width:70px"
onClick="popup1.style.visibility='hidden'">
OK</BUTTON></CENTER>
</DIV>
<DIV ID=popup2
STYLE="position:absolute;
visibility:hidden;
left:500;top:90;
width:212px;height:80;
border:2px threedhighlight outset;
background-color:threedface;
font-family:MS Sans Serif;font-size:8pt;
cursor:default"
onSelectStart="return false"
onMouseDown="makeActive(this)">
<DIV
STYLE="position:absolute;
left:0;top:0;
width:100%;height:100%;
border:1px inactiveborder solid">
</DIV>
<DIV
STYLE="position:absolute;
left:2;top:2;
width:204px;height:18px;
background-color:inactivecaption;
color:inactivecaptiontext;
font-family:MS Sans Serif;
font-size:9pt;font-weight:bold;
padding:2px"
onMouseDown="grabEl(this.offsetParent)">
DHTML Popup 2
</DIV>
<DIV
STYLE="position:absolute;
left:3;top:23;
color:windowtext">
Ваш текст.
</DIV>
<CENTER><BUTTON
STYLE="position:relative;
top:45;width:70px"
onClick="popup2.style.visibility='hidden'">
OK</BUTTON></CENTER>
</DIV>
<SCRIPT LANGUAGE="JavaScript1.2" TYPE="text/javascript">
<!--
activeElement = null;
function makeActive(el){
if (activeElement) {
activeElement.children(0).style.borderColor = "inactiveborder";
activeElement.children(1).style.backgroundColor = "inactivecaption";
activeElement.children(1).style.color = "inactivecaptiontext";
}
el.style.zIndex = (activeElement) ? (activeElement.style.zIndex+1) : 1;
el.children(0).style.borderColor = "activeborder";
el.children(1).style.backgroundColor = "activecaption";
el.children(1).style.color = "captiontext";
activeElement = el;
}
makeActive(popup1);
activeMenu = null;
function setMenu(el){
makeActive(el.offsetParent.offsetParent);
if (activeMenu) {
activeMenu.menuElement.style.visibility = "hidden";
activeMenu.style.backgroundColor = "menu";
activeMenu.style.color = "menutext";
}
el.style.backgroundColor = "highlight";
el.style.color = "highlighttext";
switch (el.id) {
case "span1":
el.menuElement = menu1;
break;
case "span2":
el.menuElement = menu2;
break;
case "span3":
el.menuElement = menu3;
break;
}
el.menuElement.style.pixelLeft = el.offsetLeft+2;
el.menuElement.style.visibility = "visible"
activeMenu = el;
document.onmousedown = killMenu;
event.cancelBubble = true;
}
function killMenu(){
activeMenu.menuElement.style.visibility = "hidden";
activeMenu.style.backgroundColor = "menu";
activeMenu.style.color = "menutext";
activeMenu = null;
document.onmousedown = null;
}
function xPress(el,on) {
el.style.borderStyle = (on) ? "inset" : "outset";
event.cancelBubble = true;
}
currentX = currentY = null;
whichEl = null;
function grabEl(el) {
if (activeMenu) killMenu();
whichEl = el;
makeActive(whichEl);
event.cancelBubble = true;
whichEl.style.pixelLeft = whichEl.offsetLeft;
whichEl.style.pixelTop = whichEl.offsetTop;
currentX = (event.clientX + document.body.scrollLeft);
currentY = (event.clientY + document.body.scrollTop);
document.onmousemove = moveEl;
document.onmouseup = dropEl;
event.returnValue = false;
}
function moveEl() {
newX = (event.clientX + document.body.scrollLeft);
newY = (event.clientY + document.body.scrollTop);
distanceX = (newX - currentX);
distanceY = (newY - currentY);
currentX = newX;
currentY = newY;
whichEl.style.pixelLeft += distanceX;
whichEl.style.pixelTop += distanceY;
event.returnValue = false;
}
function dropEl() {
document.onmousemove = document.onmouseup = null;
}
function maches()
{
alert('Link.');
}
//-->
</SCRIPT>
можно использовать как наша кнопка =)
