Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:43

In the Table but now Sub menu


Poster: snoopy2
Dated: Tuesday May 31 2005 - 8:33:37 BST

I have moved the menu into the table, this part was sucessful, yet I have lost the function of the scroll down submenus,

I have been racking my brain for hours cant work out where I went wrong,

the website is at http://marieramosphotography.com/conten ... index.html

Can anyone please help me out by shedding some light where I stuffed up.\

Website Extract

<SCRIPT TYPE="text/javascript">

with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="horizontal";
position="relative";
style=AllImagesStyle;
aI("image=main_menu.jpg;overimage=main_menu(r).jpg;status=Back To Home Page;url=http://www.marieramosphotography.com/indexmain.html;");
aI("image=menu_child.jpg;overimage=menu_child(r).jpg;showmenu=Children;");
aI("image=menu_family.jpg;overimage=menu_family(r).jpg;showmenu=Family;");
aI("image=menu_couples.jpg;overimage=menu_couples(r).jpg;showmenu=Portraits;");
aI("image=menu_wed.jpg;overimage=menu_wed(r).jpg;showmenu=Weddings;");
aI("image=packages.jpg;overimage=packages(r).jpg;showmenu=Packages;");
aI("image=menu_links.jpg;overimage=menu_links(r).jpg;showmenu=Links;");
}
drawMenus();
</SCRIPT>

----------------------------------------------------------------------------------

menu_data.js file extract

_menuCloseDelay=200;
_menuOpenDelay=50;
_subOffsetTop=2;
_subOffsetLeft=-2;


with(menuStyle=new mm_style()){
styleid=1;
bordercolor="#3B1A0B";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";


Poster: Ruth
Dated: Tuesday May 31 2005 - 18:20:36 BST

Hello,

You have some major problems with regard that page and the menu placement. I can't find any place on the page that the main menu is in a table. It is still in the menu_data.js file.

So, I downloaded the page and played until I got what you seem to be trying to show. Some information for you:

1. You can't put the menu in a div. Some browsers have hissy fits if you do that. Mostly ie for mac, but some others also cause problems, mostly in position of the submenus.

2. In order to put a main menu in a table you need to take it out of the menu data.js file.

3. You can either put the menu inside script tags in the menu cell where you want it to appear adding position="relative"; and removing any top/left position setting, and also adding a drawMenus(); at the bottom of the main or you can take it out of the menu_data.js file and put it into another file including a drawmenus(); at the bottom and save it as embed_main.js or whatever you want to name it.

4. If you choose to put it in a separate file, you do NOT put the styles or anything else in it, just put the main menu place a drawMenus(); at the end.

5. If you choose not to use a separate file, then take the main menu and paste it into the table cell where you want it to appear inside of script tags. If you have put it into a separate file, then in that table cell put the call for the file, i.e.
Code:
<SCRIPT type="text/javascript" src="embed_main.js"></SCRIPT>


I have done yours and am posting the code.

I. place this in the head of your document
Code:
<style type="text/css">
.td{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;
padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px}
</style>
You need that to make sure you don't have extra spaces around the menu, so it fits exactly into the cell, even though you have the cell coded as no spacing or padding. I have done everything I can to get this so it wouldn't show a few pixels of peachy color above the menu, however it works perfectly in IE, and Firefox only shows maybe 1px, but Netscape shows about 5 and nothing I tried gets rid of it.

II. This is the embed_main.js file
Code:
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="horizontal";
style=AllImagesStyle;
position="relative";
itemheight=51;
aI("image=main_menu.jpg;overimage=main_menu(r).jpg;status=Back To Home Page;url=http://www.marieramosphotography.com/indexmain.html;");
aI("image=menu_child.jpg;overimage=menu_child(r).jpg;showmenu=Children;");
aI("image=menu_family.jpg;overimage=menu_family(r).jpg;showmenu=Family;");
aI("image=menu_couples.jpg;overimage=menu_couples(r).jpg;showmenu=Portraits;");
aI("image=menu_wed.jpg;overimage=menu_wed(r).jpg;showmenu=Weddings;");
aI("image=packages.jpg;overimage=packages(r).jpg;showmenu=Packages;");
aI("image=menu_links.jpg;overimage=menu_links(r).jpg;showmenu=Links;");
}
drawMenus();
If you want to put it actually on the page, then just take that and put script tags around it. MAKE SURE YOU REMOVE THE MAIN MENU FROM THE MENU_DATA.JS FILE

III. This is your page starting from the body tag
Code:
<BODY bgColor=#000000
onload="FP_preloadImgs(/*url*/'menu_child(r).jpg', /*url*/'main_menu(r).jpg', /*url*/'menu_family(r).jpg', /*url*/'menu_couples(r).jpg', /*url*/'menu_wed(r).jpg', /*url*/'packages(r).jpg', /*url*/'menu_links(r).jpg', /*url*/'album1_button.jpg', /*url*/'file:///album2_button.jpg', /*url*/'file:///album3_button.jpg', /*url*/'file:///fav_button.jpg')">
<SCRIPT src="milonic_src.js" type=text/javascript></SCRIPT>

<SCRIPT type=text/javascript>
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=mmenuns4.js><\/scr"+"ipt>");      
  else _d.write("<scr"+"ipt type=text/javascript src=mmenudom.js><\/scr"+"ipt>");
</SCRIPT>

<SCRIPT src="menu_data.js" type=text/javascript></SCRIPT>
<ONLOAD="FP_PRELOADIMGS(
fav_button.jpg?)? imagebackground weddings content marieramosphotography.com
http: ?file: *url* album3_button.jpg?, album2_button.jpg?, album1_button.jpg?,
?http: menu_links(r).jpg?, images packages(r).jpg?, menu_wed(r).jpg?,
menu_couples(r).jpg?, menu_family(r).jpg?, main_menu(r).jpg?,
menu_child(r).jpg?,>
<DIV
style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none">
<DIV align=center>&nbsp;
<TABLE id=table1 cellSpacing=0 cellPadding=0 width=714 border=0>
  <TBODY>
  <TR>
    <TD width=700>
      <P align=center><IMG height=69 src="mrheader.jpg"
      width=714 border=0></P></TD></TR>&shy; </TBODY></TABLE></DIV>

<center>
<TABLE id=table3 height=304 cellSpacing=0 cellPadding=0 width=700 border=0
align="center">
  <TR>
    <TD width=700 background=weddings_bkground.jpg><TABLE id=table4 cellSpacing=0
      cellPadding=0 width="100%" border=0 class="td">
   <TR>
     <TD colspan="2" class="td">
      <table border="0" cellpadding="0" cellspacing="0" height="51" width="100%">
<tr><td width=7 ></td>
    <td >
   
   <SCRIPT src="embed_main.js" type=text/javascript></SCRIPT>
</td>
</tr>
</table></TD>
   </TR><div align="center">
   <TR>
     <TD vAlign=top width=470><FONT face=Arial size=2>Text about weddings
       here</FONT></TD>
     <TD><DIV align=left>
         <TABLE id=table5 cellSpacing=16 width="100%" align=left border=0>
      <TR>
        <TD width=36><IMG id=img8 onmouseover="FP_swapImg(1,1,/*id*/'img8',/*url*/'imagebackground/album1_button.jpg')"
         onclick="FP_goToURL(/*href*/'index1.html')" onmouseout=FP_swapImgRestore()
         height=36 src="album1_button(b).jpg" width=36 border=0></TD>
        <TD><FONT face=Arial size=2>Album One</FONT></TD>
      </TR>
      <TR>
        <TD width=36><IMG id=img9 onmouseover="FP_swapImg(1,1,/*id*/'img9',/*url*/'imagebackground/album2_button.jpg')"
         onclick="FP_goToURL(/*href*/'index2.html')" onmouseout=FP_swapImgRestore()
         height=36 src="album2_button(b).jpg" width=36 border=0></TD>
        <TD><FONT face=Arial size=2>Album Two</FONT></TD>
      </TR>
      <TR>
        <TD width=36 height=24><IMG id=img10 onmouseover="FP_swapImg(1,1,/*id*/'img10',/*url*/'imagebackground/album3_button.jpg')"
         onclick="FP_goToURL(/*href*/'index3.html')" onmouseout=FP_swapImgRestore()
         height=36 src="album3_button(b).jpg" width=36 border=0></TD>
        <TD height=24><FONT face=Arial size=2>Album Three</FONT></TD>
      </TR>
      <TR>
        <TD width=36><IMG id=img11 onmouseover="FP_swapImg(1,1,/*id*/'img11',/*url*/'imagebackground/fav_button.jpg')"
         onclick="FP_goToURL(/*href*/'indexf.html')" onmouseout=FP_swapImgRestore()
         height=36 src="fav_button(b).jpg" width=36 border=0></TD>
        <TD><FONT face=Arial size=2>Favourites</FONT></TD>
      </TR>
         </TABLE>
       </DIV>
     </TD>
   </TR>
   <TR>
     <TD width=470>&nbsp;</TD>
     <TD>&nbsp;</TD>
   </TR>
      </TABLE>
    </TD>
  </TR>
</TABLE></center></DIV></DIV>
<P>&nbsp;</P>


If you paste those above into your page [save it as something different than your original for testing purposes] And then view it, the menu should be right where you want it. Hope this helps.

Ruth


Poster: snoopy2
Dated: Tuesday May 31 2005 - 23:44:07 BST

Hello Ruth,

Thankyou so much for looking at my page, and spending the time showing me where I went wrong and the correctiona I need,

I will make these changes tonight, and I will let you know how I go, I am confident that it willwork perfectly.

Kindest Reagrds

Greg

Almost There


Poster: snoopy2
Dated: Wednesday June 1 2005 - 12:56:02 BST

Hello Ruth,

***SOLVED***

I had aa Children instead of just Children, im an idiot, Thankyou so much for all your assistance, I really do appreciate the time you spent with me.

*** SOLVED ****


****THANKYOU THANKYOU****

I think were almost there, I copied all your work into a new page, at
http://marieramosphotography.com/conten ... ndex2.html

and the menu sits exactly were it should, though I dont have the two options below

Gallery
Information

Ill Rellok over yet, I think something is not right, any ideas, sorry to be such high maintenance, once I learn It will be a piece of cake . mmmmm cake.