Deamweaver using Fireworks

I am setting up a web page that has a drop down menu made with fireworks. The menu works great but when i put the menu in a layer it changes is function. The menu works like this  
Menu               ****           But with layers it works like this       ****       Menu
        menu-1                                                                                        
        menu-2
        menu-3
                                                                                                                         menu-1
                                                                                                                         menu-2
                                                                                                                         menu-3
Why does it drop down so far when i use layers.
Thank you.
 
jodyreidIT ManagerAsked:
Who is Participating?
 
Jason C. LevineNo oneCommented:
Use float and clear to control how the elements appear.  It looks like you are already starting down this path from yout source code...you just need to clean things up a bit more.
0
 
Jason C. LevineNo oneCommented:
Hi jodyreid,

Without the source code, I can only guess but my guess is that the layer is defined with a position (either relative or absolute) and fireworks menu also a position definition that is screwing things up.
0
 
jodyreidIT ManagerAuthor Commented:
<cfquery name="AprCalData" datasource="Calendar">
SELECT *
FROM April2005</cfquery>

<html><head>
<!-- TemplateParam name="OptionalRegion1" type="boolean" value="true" -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.style6 {
      font-size: 14px;
      color: #115542;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript"
>function mmLoadMenus() {
  if (window.mm_menu_0405094730_0) return;
  window.mm_menu_0405094730_0 = new Menu("root",150,24,"Times New Roman, Times, serif",18,"#ffff33","#ff0000","#59a48d","#59a48d","center","middle",3,0,100,-5,7,true,true,true,0,false,true);
  mm_menu_0405094730_0.addMenuItem("January&nbsp;2005","window.open('http://localhost:8500/Calendar/2005/Jan2005/January2005.cfm', '_self');");
  mm_menu_0405094730_0.addMenuItem("February&nbsp;2005","location='http://localhost:8500/Calendar/2005/Feb2005/February2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("March&nbsp;2005","location='http://localhost:8500/Calendar/2005/Mar2005/March2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("April&nbsp;2005","location='http://localhost:8500/Calendar/2005/Apr2005/April2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("May&nbsp;2005","location='http://localhost:8500/Calendar/2005/May2005/May2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("June&nbsp;2005","location='http://localhost:8500/Calendar/2005/June2005/June2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("July&nbsp;2005","location='http://localhost:8500/Calendar/2005/July2005/July2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("August&nbsp;2005","location='http://localhost:8500/Calendar/2005/Aug2005/August2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("September&nbsp;2005","location='http://localhost:8500/Calendar/2005/Sept2005/September2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("October&nbsp;2005","location='http://localhost:8500/Calendar/2005/Oct2005/October2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("November&nbsp;2005","location='http://localhost:8500/Calendar/2005/Nov2005/November2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("December&nbsp;2005","location='http://localhost:8500/Calendar/2005/Dec2005/December2005.cfm'");
   mm_menu_0405094730_0.hideOnMouseOut=true;
   mm_menu_0405094730_0.menuBorder=0;
   mm_menu_0405094730_0.menuLiteBgColor='#00ffff';
   mm_menu_0405094730_0.menuBorderBgColor='#59a48d';
   mm_menu_0405094730_0.bgColor='#ffffff';

  window.mm_menu_0405144601_0 = new Menu("root",75,24,"Times New Roman, Times, serif",18,"#ffff33","#ff0000","#59a48d","#59a48d","left","middle",3,0,100,-5,7,true,true,true,0,false,true);
  mm_menu_0405144601_0.addMenuItem("Januray","window.open('http://localhost:8500/Calendar/2005/Jan2005/January2005.cfm', '_parent');");
   mm_menu_0405144601_0.hideOnMouseOut=true;
   mm_menu_0405144601_0.menuBorder=0;
   mm_menu_0405144601_0.menuLiteBgColor='#00ffff';
   mm_menu_0405144601_0.menuBorderBgColor='#59a48d';
   mm_menu_0405144601_0.bgColor='#ffffff';

  mm_menu_0405144601_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);
//-->
</script>
<script language="JavaScript1.2" src="2005/mm_menu.js"></script>
</head><META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META name="description" content=>
<META name="keywords" content=>
<title>default: April 2005</title> <style type="text/css">

<!--

/* CSS for calendar C:\Program Files\iCal v3.10 Web Calendar\AprData\default.cal  */
body.bodyclass{ font-weight:normal; font-size:12px;color:#000000;background-color:#CDF2D7;}
.tdcalendartitle{ font-weight:normal; font-size:x-large; font-family:Arial;color:yellow;background-color:darkgreen;text-align:center;}
.calendarmonthyear{ font-weight:bold; font-size:x-large; font-family:Arial;color:black;background-color:#CDF2D7;text-align:center;}
.tdcalendarheader{ font-weight:normal;color:black;background-color:navajowhite;}
.tdcalendarfooter{ font-weight:normal;color:#000000;background-color:#BBFFBB;}
.tdlistymtitle{ font-weight:normal; font-size:20px; font-family:Arial;color:#000000;background-color:#CDF2D7;}
A.tdlistymtitle_link{ font-size:20px; text-decoration:underline;color:#000000;}
.navigatebar_bgcolor{background-color:#97A68D;}
.navigatebar_labels{ font-weight:bold; font-size:x-small; font-family:Arial;color:black;background-color:#97A68D;}
.navigatebar_year{ font-weight:normal; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#97A68D;}
A.navigatebar_year_link{ font-weight:normal; text-decoration:underline; font-size:12px; font-family:Arial;color:black;background-color:#97A68D;}
.navigatebar_monthweek{ font-weight:normal; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#97A68D;}
.navigatebar_monthweek_selected{ font-weight:bold; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#CCCCCC;}
A.navigatebar_monthweek_link{ font-weight:normal; font-size:12px; text-decoration:underline; font-family:Arial;color:black;background-color:#97A68D;}
.displaybar_bgcolorleft{text-align:left;background-color:#97A68D;}
.displaybar_bgcolorright{text-align:right;background-color:#97A68D;}
.displaybar_bgcolor{
      text-align:left;
      background-color:#97A68D;
      color: #FFFF66;
}
.displaybar_textelement{ font-weight:normal; font-size:12px; font-family:Arial;color:black;background-color:#97A68D;text-align:center;white-space:nowrap;}
.displaybar_selected{ font-weight:bold; font-size:12px; font-family:Arial;color:black;background-color:#CCCCCC;text-align:center;}
A.displaybar_textelement_link{ font-weight:normal; font-size:12px; text-decoration:underline;white-space:nowrap; font-family:Arial;color:black;background-color:#97A68D;}
select.navbarselect{color:black;background-color:#CCCCCC;}
.weekdayheadings{ font-weight:normal; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
.prevnextmonth{ font-weight:normal; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
A.prevnextmonth_link{ font-size:medium; text-decoration:underline;color:#FFFFFF;background-color:#0D0D0D;}
A.subscribelink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:black;text-align:left;}
A.outlookaddlink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:black;text-align:left;}
.offmonthbg{background-color:#336600;text-align:left;}
.blockdefaultmonthbg{background-color:#FFFF66;text-align:left;}
.listdefaultmonthbg{background-color:#BBBBBB;text-align:left;vertical-align:top;}
.timeplanmonthbg{background-color:#BBBBBB;text-align:left;vertical-align:top;}
.timeplanmonthbgshadow{background-color:#BBBBBB;text-align:left;vertical-align:top; border-top: outset; border-right: outset; border-bottom: outset; border-left: outset; border-top-width: 1px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 1px; }
.dayofmonth{background-color:#CDF2D7;color:#0D0D0D;text-align:left;}
A.dayofmonth_link{ font-weight:normal; font-size:medium; text-decoration:underline; font-family:Arial;color:#000000;background-color:#CDF2D7;text-align:left;}
A.listdatelink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:#000000;background-color:#BBBBBB;text-align:left;}
A.listeventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#BBBBBB;}
.todaysdate{background-color:limegreen;text-align:left;}
A.todaysdate_link{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:limegreen;text-align:left;}
.calendarevent{ font-weight:normal; font-size:12px; font-family:Arial; font-style:normal;color:#000000;}
.listcalendarevent{ font-weight:normal; font-size:12px; font-family:Arial; font-style:normal;color:#000000;}
.fonttime{ font-weight:normal; font-style:normal; font-size:xx-small; font-family:Arial;color:#000000;}
A.eventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#BBBBBB;}
A.offeventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#8DA694;}
.weeknumber{ font-weight:normal; font-style:normal; font-size:12px; font-family:Arial;color:#000000;text-align:left;}
.listshortdaytext{ font-weight:normal; font-style:normal; font-size:small; font-family:Arial;color:#000000;background-color:#CDF2D7;text-align:center;vertical-align:top;}
.listlabeltext{ font-weight:normal; font-style:normal; font-size:xx-small; font-family:Arial;color:#000000;}
.quickfilter_left{ font-weight:bold; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:white;background-color:black;text-align:left;}
.quickfilter_right{ font-weight:bold; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:white;background-color:black;text-align:right;}
A.quickfilter_link{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:small; text-decoration:underline;color:white;}
.blockyearfullmonth{ font-weight:normal; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:black;background-color:#888888;text-align:center;}
A.blockyearfullmonthlink{ font-weight:normal; text-decoration:underline; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:black;background-color:#888888;}
.blockyearmonthtitle{background-color:#0D0D0D;text-align:center;}
A.blockyearmonthtitlelink{ font-weight:bold; font-style:normal; text-decoration:underline; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
.blockyearasterisk{ font-weight:normal; font-style:normal; font-size:xx-small;text-align:center;}
.blockyearweekday{ font-weight:normal; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#CDF2D7;text-align:center;}
.blockyeardaynum{background-color:#BBBBBB;text-align:center;}
A.blockyeardaynumlink{ font-weight:normal; font-style:normal; text-decoration:underline; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#BBBBBB;text-align:center;}
.blockyearweeknum{background-color:#CDF2D7;text-align:center;}
A.blockyearweeknumlink{ font-weight:normal; font-style:italic; text-decoration:underline; font-size:x-small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#CDF2D7;text-align:center;}
.plannerweek{ font-weight:normal; font-style:normal; font-size:medium; font-family:Arial;background-color:#CDF2D7;text-align:left;}
A.plannerweek_link{ font-weight:normal; text-decoration:underline;color:#000000;background-color:#CDF2D7;text-align:left;}
.popbody{background-color:navajowhite;}
.popuptitle{ font-weight:normal; font-style:normal; font-size:medium; font-family:Arial;color:#0000FF;text-align:left;}
.popupdata{ font-weight:normal; font-style:normal; font-size:small; font-family:Arial;color:#0000FF;text-align:left;}
.popupdate{ font-weight:bold; font-style:normal; font-size:x-small;text-align:left;}
.style4 {background-color: #FFFF66; text-align: left; color: #FF0000; }
.style7 {color: #1D04FB}
-->

</style>


</head>
<body class=bodyclass><center>
<div id="Layer1" style="position:absolute; width:75%; height:350px; z-index:4; left: 322px; top: 138px;"></div>
<div id="Layer3" style="position:absolute; width:323px; height:345px; z-index:5; left: 1px; top: 93px;">  
  <div align="left"><a href="#" onMouseOut="MM_startTimeout();" onMouseOver="MM_showMenu(window.mm_menu_0405094730_0,177,30,null,'Menu');">
    <script language="JavaScript1.2">mmLoadMenus();</script>
    </a>
    <table border="0" cellpadding="0" cellspacing="0" width="150">
      <!-- fwtable fwsrc="Menu1.png" fwbase="Menu1.gif" fwstyle="Dreamweaver" fwdocid = "1790405285" fwnested="0" -->
      <tr>
        <td><img src="2005/spacer.gif" width="4" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="138" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="8" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="1" border="0" alt=""></td>
      </tr>
      <tr>
        <td colspan="3"><img name="Menu1_r1_c1" src="2005/Menu1_r1_c1.gif" width="150" height="5" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="5" border="0" alt=""></td>
      </tr>
      <tr>
        <td rowspan="2"><img name="Menu1_r2_c1" src="2005/Menu1_r2_c1.gif" width="4" height="245" border="0" alt=""></td>
        <td><a href="#" onMouseOut="MM_startTimeout();" onMouseOver="MM_showMenu(window.mm_menu_0405144601_0,139,27,null,'Menu1_r2_c2');"><img name="Menu1_r2_c2" src="2005/Menu1_r2_c2.gif" width="138" height="29" border="0" alt=""></a></td>
        <td rowspan="2"><img name="Menu1_r2_c3" src="2005/Menu1_r2_c3.gif" width="8" height="245" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="29" border="0" alt=""></td>
      </tr>
      <tr>
        <td><img name="Menu1_r3_c2" src="2005/Menu1_r3_c2.gif" width="138" height="216" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="216" border="0" alt=""></td>
      </tr>
    </table>
</div>
</div>
<div id="Layer2" style="position:absolute; width:100%; height:133px; z-index:2; left: 1px; top: 2px;">
  <table  width="100%" height="93"  class=tblcalendartitle>
    <tr>
      <td height="63" colspan=17 class=tdcalendartitle ><div align="center"> Event Calendar </div></td>
    </tr>
  </table>
  <table  width="98%"  class=tblcalendarheader>
  </table>
  <center>
  </center>
  <center>
  </center>

  <center>
</center>
</div>
</body><head><META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE"></head></html>
This is the code I am using for the layers and menu.
I do not know if this will help solve my problem.
Thank you.
Jody
0
Cloud Class® Course: Certified Penetration Testing

This CPTE Certified Penetration Testing Engineer course covers everything you need to know about becoming a Certified Penetration Testing Engineer. Career Path: Professional roles include Ethical Hackers, Security Consultants, System Administrators, and Chief Security Officers.

 
jodyreidIT ManagerAuthor Commented:
Can anyone help with this problem. This is the second time i have put this problem in and still can not get an answer. It would help alot if someone could take a look at this problem.
Thank you.
0
 
Jason C. LevineNo oneCommented:
Hi jodyreid,

Sorry about the delay.  I had some RL issues to take care off.

As I noted above, you are using an absolutely positioned layer to hold things and that can have funny effects on nested div tags within that layer.  Also, run your page through the W3 validator (validator.w3.org).   You have a number of errors that could cause browsers to be reverting to quirks mode and that can screw up the display of the elements too.

Finally, can you post a link to the page so I can preview it with images?
0
 
jodyreidIT ManagerAuthor Commented:
Thank you. This i think will solve my problem, what do i use instead of the absolutely position for best results.
Thank you.
0
 
Jason C. LevineNo oneCommented:
Thanks for the points.  Good luck!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.