Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

pop up menu "hides" behind layer (image in layer)

Status
Not open for further replies.

ferolo

Technical User
Sep 29, 2005
13
SE
Hi....HELP!!!

oki...now this one is really frustrating for me. I have created a site in DW MX 2004 with some background images, which i have placed in layers. I have also created a navbar via the div tag according to the tutorial that is included. I then created a pop up menu via the behavior menu (onmouseover the navbar image).

The menu works great...except for the problem: it only pops up BEHIND the background layers i use for the text content. I just dont get it. I have tried placing the layers in different order, and i have also tried setting images as bgimages in the layers instead of just inserting them as images. WHY does the darn thing pop BEHIND the layers??? i mean.....it gets VERY difficult to fix some more layers or some other stuff if the darn thing is impossible to appear in front of the layers so u can actually use the menu.

someone PLEASE help me with this....its driving me crazy!!!!!!

here is the code:(including the javascript...so it will be a long one)

if someone can explain this for me i will proclaim this as the absolutely best WYSWYG program EVER made... :p


code:
---------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function mmLoadMenus() {
if (window.mm_menu_1005052222_0) return;
window.mm_menu_1005052222_0_1 = new Menu("kursnamn",46,18,"Arial, Helvetica, sans-serif",12,"#FFFFFF","#FFFFFF","#999999","#93010E","left","middle",3,0,1000,-5,7,true,true,true,0,true,true);
mm_menu_1005052222_0_1.addMenuItem("info");
mm_menu_1005052222_0_1.hideOnMouseOut=true;
mm_menu_1005052222_0_1.bgColor='#000000';
mm_menu_1005052222_0_1.menuBorder=1;
mm_menu_1005052222_0_1.menuLiteBgColor='#FFFFFF';
mm_menu_1005052222_0_1.menuBorderBgColor='#777777';
window.mm_menu_1005052222_0 = new Menu("root",82,18,"Arial, Helvetica, sans-serif",12,"#FFFFFF","#FFFFFF","#999999","#93010E","left","middle",3,0,1000,-5,7,true,true,true,0,true,true);
mm_menu_1005052222_0.addMenuItem(mm_menu_1005052222_0_1);
mm_menu_1005052222_0.hideOnMouseOut=true;
mm_menu_1005052222_0.childMenuIcon="arrows.gif";
mm_menu_1005052222_0.bgColor='#000000';
mm_menu_1005052222_0.menuBorder=1;
mm_menu_1005052222_0.menuLiteBgColor='#FFFFFF';
mm_menu_1005052222_0.menuBorderBgColor='#777777';

mm_menu_1005052222_0.writeMenus();
} // mmLoadMenus()

function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
if (event == "init" && args.length > 2) {
if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
nbArr[nbArr.length] = img;
for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = args[i+1];
nbArr[nbArr.length] = img;
} }
} else if (event == "over") {
document.MM_nbOver = nbArr = new Array();
for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
nbArr[nbArr.length] = img;
}
} else if (event == "out" ) {
for (i=0; i < document.MM_nbOver.length; i++) {
img = document.MM_nbOver; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
} else if (event == "down") {
nbArr = document[grpName];
if (nbArr)
for (i=0; i < nbArr.length; i++) { img=nbArr; img.src = img.MM_up; img.MM_dn = 0; }
document[grpName] = nbArr = new Array();
for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
nbArr[nbArr.length] = img;
} }
}
//-->
</script>
<style type="text/css">
<!--
body {
background-color: #CCCCCC;
}
-->
</style>
<script language="JavaScript" src="mm_menu.js"></script>
</head>

<body onLoad="MM_preloadImages('Bilder/meny/button_kurser_black_redover.gif')">
<script language="JavaScript1.2">mmLoadMenus();</script>
<div id="toplayer" style="position:absolute; width:925px; height:134px; z-index:1; left: -2px; top: -2px;"><img src="Bilder/Layout/bgtop.gif" width="1009" height="126"> </div>
<div id="maincontentlayer" style="position:absolute; width:673px; height:477px; z-index:2; left: 126px; top: 112px; background-image: url(Bilder/Layout/main_content.gif); layer-background-image: url(Bilder/Layout/main_content.gif); border: 1px none #000000;"></div>
<div id="menulayer" style="position:absolute; width:130px; height:463px; z-index:3; left: -2px; top: 121px; background-image: url(Bilder/Layout/bgleft.gif); layer-background-image: url(Bilder/Layout/bgleft.gif); border: 1px none #000000;">
<div class="navbar">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="javascript:;" target="_top" onClick="MM_nbGroup('down','group1','kurs','',1)" onMouseOver="MM_nbGroup('over','kurs','Bilder/meny/button_kurser_black_redover.gif','',1)" onMouseOut="MM_nbGroup('out')"><img src="Bilder/meny/button_kurser_black.gif" alt="" name="kurs" width="120" height="25" border="0" onMouseOver="MM_showMenu(window.mm_menu_1005052222_0,117,22,null,'kurs')" onMouseOut="MM_startTimeout();" onload=""></a></td>
</tr>
</table>
</div>
</div>
</body>
</html>
-----------------
end code ... (err... like u didnt figure that one out :p)
 
set the z-index to be the top layer - for the popup I mean.
 
how do i set the z-index for the pop up menu itself? i mean....the z-index for the layers i can see and alter. But no matter how i change the z-index there, it still hides behind the layer.

the pop up menu is created via the "behaviour" list for the image i have placed in my navbar. From there u create the pop up menu via the built in function in dreamweaver mx 2004. The behavior onmouseover is used to set the action show pop up menu. How do i change the z-index for this particular pop up menu? where can i see the z-index for the pop up menu that is created with this function?

grrrr... |-(
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top