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:54
Unable to see menu on page
Poster: katybat
Dated: Friday September 15 2006 - 14:37:41 BST
I'm not the most experienced web designer so maybe I'm missing something, but I have built a beautiful menu, but alas I can only see it within the header component I have built. When I try to place the header into a webpage (as a smart component), the menu no longer appears. All the code seems to be there but the menu is not. Can I not use the menu as part of a smart component? Do I have to insert it separately into every page on my site?
The page I tried to insert it in is here: http://www.gipl.org/home.html (I tried it a different way here: http://www.gipl.org/home1.html). In both cases, when I originally built the component for the header, the menu shows up fine, but when I try to insert the header component into one of the site pages, the menu disappears.
I'm using Adobe GoLive to build my website if that makes any difference.
Thanks,
Katy
Poster: stephen702
Dated: Friday September 15 2006 - 21:04:32 BST
Note: I'm not a Milonic support person. I just recognize the problem and thought I might be able to help.
The Milonic files aren't where your home page thinks they are.
For example, your home page shows:
<script language=JavaScript src="../web-data/Components/milonic_src.js" type=text/javascript></script>
The above would look for the menu file in a subfolder called "Components" located in another subfolder called "web-data".
But on your website the "milonic_src.js" file is located in the main directory, not in a subfolder, as you indicate in your code.
In other words, the code should read:
<script language=JavaScript src="milonic_src.js" type=text/javascript></script>
You might want to check your page code to make sure all your menu files are properly referenced.
I suspect that the file locations you're using reflect the folder setup on your hard drive, not on the actual website. I say that because one of your graphics (the one across the top) doesn't display when I view the page. And the image link refers to your hard drive instead of to the web server:
<img src="file:///Users/katharinehinman/Documents/GIPL/GIP%26L/GIPL%20website/web-content/misc/WebMasthead.data_/images/WebMasthead_01.gif" alt="" width="800" height="73" border="0">
Still some issues...
Poster: katybat
Dated: Sunday September 17 2006 - 21:05:19 BST
I managed to get the menu to appear by shifting the location of the files, but now I have another problem. Even though in the "header" subfile, when I preview it, I see the menu the way I've built it, when I place the header onto a page, the colors don't work. Only the Links button (which has no submenu) appears the way I want it to (white text on dark green background). All the others appear to be white on white when off and black on white when on (except for Home which is black on blue when off and black on light green (which is what I want) when on). See http://www.gipl.org/home.html. Thanks!
The menu_data.js file looks like this:
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
with(menuStyle=new mm_style()){
bordercolor="#003700";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#003700";
headercolor="#ffffff";
offbgcolor="#003700";
offcolor="#FFFFFF";
onbgcolor="#55DF60";
oncolor="#000000";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#999999";
separatorsize=2;
subimage="arrow.gif";
subimagepadding=4;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
left=132;
orientation="horizontal";
style=menuStyle;
top=75;
aI("text=Home;url=http://www.gipl.org/home.html;");
aI("showmenu=About;text=About Us;");
aI("showmenu=Act;text=Take Action;");
aI("showmenu=Learn;text=Learn More;");
aI("showmenu=Worship;text=Worship;");
aI("showmenu=Events;text=Events;");
aI("text=Links;url=http://www.gipl.org/links.html;");
}
with(milonic=new menuname("About")){
overflow="scroll";
style=menuStyle;
aI("text=About GIPL;url=http://www.gipl.org/about.html;");
aI("text=Green Light;url=http://www.gipl.org/greenlight.html;");
aI("text=People;url=http://www.gipl.org/people.html;");
aI("text=Congregations;url=http://www.gipl.org/congregations.html;");
aI("text=Interfaith Power & Light;url=http://www.gipl.org/ipl.html;");
aI("text=Contact Us;url=http://www.gipl.org/contact.html;");
}
with(milonic=new menuname("Act")){
style=menuStyle;
aI("text=First Steps;url=http://www.gipl.org/act.html;");
aI("text=Power Lite;url=http://www.gipl.org/powerlite.html;");
aI("text=Energy Audits;url=http://www.gipl.org/audits.html;");
aI("text=Compact Fluorescent Lights;url=http://www.gipl.org/CFLs.html;");
aI("text=Save Gas;url=http://www.gipl.org/savegas.html;");
aI("text=Join GIPL;url=http://www.gipl.org/join.html;");
}
with(milonic=new menuname("Learn")){
style=menuStyle;
aI("text=Why Should I Care?;url=http://www.gipl.org/whycare.html;");
aI("text=Resources;url=http://www.gipl.org/learn.html;");
aI("text=Educational Programs;url=http://www.gip.org/education.html;");
}
with(milonic=new menuname("Worship")){
style=menuStyle;
aI("text=Green Worship;url=http://www.gipl.org/worship.html;");
aI("text=Scripture;url=http://www.gipl.org/scripture.html;");
aI("text=Prayers;url=http://www.gipl.org/prayer.html;");
aI("text=Devotionals;url=http://www.gipl.org/devotional.html;");
}
with(milonic=new menuname("Events")){
style=menuStyle;
aI("text=Event Calendar;url=http://www.gipl.org/events.html;");
aI("text=Newsletter Blurbs;url=http://www.gipl.org/blurbs.html;");
}
with(milonic=new menuname("Links")){
style=menuStyle;
aI("text=Links;url=http://www.gipl.org/links.html;");
aI("text=DHTML Menus by Milonic;url=http://www.milonic.com;");
}
drawMenus();
What am I doing wrong? (I wasn't sure what headercolor did, so I tried changing it to what I wanted the offcolor to be to see if that would help, but it didn't seem to make any difference one way or the other)
Poster: Ruth
Dated: Monday September 18 2006 - 0:13:06 BST
Hi,
It's your css file with the generic codes for the tables. The menu is designed so people can style it using css only if they want so it tend to pick up generic codes, usually it's only for padding and td.
Code:
TD {
FONT-SIZE: small; BACKGROUND: #ffffff; MARGIN: 0px 0px 10px; COLOR: black; FONT-FAMILY: Tahoma, Helvetica, Arial, sans-serif
}
FONT-SIZE: small; BACKGROUND: #ffffff; MARGIN: 0px 0px 10px; COLOR: black; FONT-FAMILY: Tahoma, Helvetica, Arial, sans-serif
}
If you change that to a class instead the menu won't read it and apply it in the tables that way, the menu won't read it.
Ruth
Poster: katybat
Dated: Monday September 18 2006 - 14:59:26 BST
I thought I had done that correctly, but apparently not. Can you be a little more explicit on how to do that? I applied it as a class style to the file and it appears in the source code, but I'm still having the same problem. I'm not an experienced coder, so I think I must be making a fairly obvious mistake, but I can't figure it out.
Sorry to be so thick.
Poster: katybat
Dated: Monday September 18 2006 - 15:03:23 BST
An additional note, I didn't embed the menu into a table. There is a table (to line up the graphics), but the menu should be just sitting on top of it. I did not (intentionally at least) follow the instructions for placing the menu into a table. Should I have? I just used the position code in the menu_data.js file to make it show up where I wanted it to on the page. Therefore, it wouldn't seem to me that the the css for tables should make any difference.
If it is still the css problem, do I need to delete the element css style for tables completely or just apply a class style "on top of" it?
Poster: stephen702
Dated: Monday September 18 2006 - 23:47:43 BST
I notice that some of your CSS and HTML files referenced in your home page code have the same problems that your Milonic files did.
For example:
<csobj csref="../web-data/Components/header2.html" h="131" occur="44" t="Component" w="848">
The home page is looking for a folder called 'web-data' with another folder inside it called 'Components'. Do those exist on your web server?
(I found a "header2.html" file in your main folder, however, and that page's menu seems to work the way you intended)
Likewise:
<csimport user="../web-data/Components/main_footer.html" occur="84">
<csimport user="../Components/header.html" occur="73">
<csimport user="../Components/faith_initiative_links.html" occur=
Poster: Ruth
Dated: Tuesday September 19 2006 - 4:40:35 BST
Hello,
When you code your css file for generics, like having TD{whateverstuff} that means that it will apply to all tables. Since the menu has table in the programming, when you use the generic in the css the menu reads it.
If however you were to change that TD generic to a class, for example, .TD{whateverstuff} and then on your page you would call that class in your tables, then the menu wouldn't read it.
To see what I mean, try removing that TD from your css file and then take a look at the menu when that is not in your css, you'll see that the menu is fine.
Your other choice is to make an off and on class and apply it to the menu. Put the following into your css file
Code:
.menuOff
{
background-color:#003700;
color:#ffffff
}
.menuOn
{
background-color:#55DF60;
color:#000000
}
{
background-color:#003700;
color:#ffffff
}
.menuOn
{
background-color:#55DF60;
color:#000000
}
Then in your menu_data.js file put double slashes, // so that the offbgcolor etc. will be //offbgcolor=#003700; and so on for the offcolor, onbgcolor and oncolor. Then add this to the menuStyle
Code:
offclass="menuOff";
onclass="menuOn";
onclass="menuOn";
This means the menu will now apply this as the colors instead of reading your generic TD background color that you have in the css file.
Ruth
Fixed?
Poster: katybat
Dated: Tuesday September 19 2006 - 21:20:46 BST
Well it seems to be working now. I deleted a whole bunch of css info, so I hope that doesn't come back and bite me, but I think it's okay. Basically, I deleted any reference to tables in both generic and class files (so I assume now they will just have the same styling as the body, which is fine), and two extra css files that were hanging around (which I think were extraneous - at least I hope they were extraneous).
I did try the suggestion about adding a new class style for the menu, but that made things all kinds of funky looking, so apparently it didn't work right.
Anyhow, I think it's fixed for now (knock wood) and all I'll need to watch out for is something else messing up because of the css purge.
As far as the mysterious files that Stephen referenced, I don't know where they live, but they show up on the page so I assume they're on the server somewhere. Adobe GoLive has a special components folder that it stores some objects in and somehow that manages to upload onto the server, but I'm not sure how they are filed. The main_footer.html file, for instance, is the footer that's on the bottom of every page, so apparently it's in there somewhere....
Anyhow, thank you both so much for all your help!
Can you tell I'm basically making up how to build a webpage as I go along?