Popup() function not working - [Solved]

[mcarlson]

I'm having trouble getting the popup() function to work. I'm wondering if anyone else has run into this. I'm using version 5.774 of the menu. I've created a menu called "program". Then I've got a link on the page with this code:
<a href="javascript:void(0)" onmouseover="popup('program')">open menu</a>
When I mouse over the link, nothing happens - no error - just nothing. I've used this function successfully in the past, but can't get it to work for some reason now. Any help would be greatly appreciated.

[Ruth]

Hi,

I need to see the page to try and figure out what's going on, because I know the popup menu works.

Ruth

[mcarlson]

I'm sure I'm just doing something stupid which is preventing it from working. I've set up a test page for you to look at:
http://www.cycloneinteractive.net/milonictest/about/
You can see the Program menu works by rolling over "Program & Events", but the link in the content area "Open Program Menu" uses the popup() function to open the Program menu on mouseover, but it doesn't seem to work.

[Ruth]

Hi,

There's something wrong in the data file. I couldn't get it to work until I put it in the downloaded menu_data file. 1st, you have no drawMenus(); at the end of the data file which you need. Anyway, try copy and pasting this

Code: Select all

with(AllImagesStyle=new mm_style()){
styleid=1;
bordercolor="#000000";
borderstyle="solid";
fontstyle="normal";
fontweight="normal";
padding=3;
}
with(popupStyle=new mm_style()){
fontfamily="Verdana, Tahoma, Arial";
fontsize="10px";
fontstyle="normal";
fontweight="bold";
offbgcolor="#666666";
offcolor="#FFFFFF";
onbgcolor="#999999";
oncolor="#ffffff";
outfilter="Fade(duration=0.3)";
overfilter="Fade(duration=0.2);";
padding=5;
separatorcolor="#FFFFFF";
separatorsize=1;
//subimage="arrow.gif";
//subimagepadding=2;
}

with(milonic=new menuname("program")){
	overflow="scroll";
	style=popupStyle;
	aI("text= Calendar;url=/program/calendar.cfm;");
	/*aI("text= Photo Gallery;url=/program/;");*/
	aI("text= Annual Awards;url=/program/index.cfm?docid=1;");
	aI("text= Regional Conference;url=/program/index.cfm?docid=2;");
	aI("text= Program Series;url=/program/index.cfm?docid=3;");
	aI("text= Charity Golf;url=/program/index.cfm?docid=4;");
}

with(milonic=new menuname("resources")){
	overflow="scroll";
	style=popupStyle;
	aI("text= Job Bank;url=/resources/jobs.cfm;");
	aI("text= News;url=/resources/news.cfm;");
	aI("text= Newsletter Archive;url=/resources/;");
	aI("text= Industry Links;url=/resources/index.cfm?docid=5;");
	aI("text= Mentors;url=/resources/index.cfm?docid=6;");
	aI("text= CPSM;url=/resources/index.cfm?docid=7");
	aI("text= Profiles;url=/resources/;");
}

with(milonic=new menuname("about")){
	overflow="scroll";
	style=popupStyle;
	aI("text= Letter from the President;url=/about/index.cfm?docid=8;");
	aI("text= Board of Directors;url=/about/index.cfm?docid=9;");
	aI("text= Committee and Chairs;url=/about/;");
	aI("text= Past Presidents' Club;url=/about/index.cfm?docid=10;");
	aI("text= Member Benefits / Join Us;url=/about/index.cfm?docid=11;");
	aI("text= Chapter By-Laws;url=/about/index.cfm?docid=12;");
	aI("text= SMPS National;url=http://www.smps.org;target=_blank");
	aI("text= Sponsorhip Opportunities;url=/about/index.cfm?docid=13;");
}
drawMenus();

Then on your page, change your popup call to

Code: Select all

<a href=# onMouseOver="popup('program',1)" onmouseout="popdown" ()>Open Program Menu</A>

You also need to update your menu files. We can't do support for not up to date menus since the files change and normally we couldn't find what the problem is. In this instance it is something in your data file that is the problem, it seems something got corrupted or something. Anyway, try this, it fixed whatever was wrong when I redid the data file.

Ruth

[Kristy]

I'm having a similar problem. I'm using Milonic on 2 different sites; one of them works and the other does not. I copied the code from the one that works to create the new one, but only the first menu that is selected will pop up. In order to see any others, the page must be refreshed. I loaded the image preloader, but it didn't seem to help.
Here's the URL of the page that does not work: http://iss.troup.k12.ga.us/CES/index.htm

Here's the code:

Code: Select all

]<script type="text/javascript" src="milonic_src.js"></script> 
<noscript><a href="https://milonic.com/">JavaScript DHTML Menu Powered by Milonic</a></noscript>
 <script type="text/javascript" src="mmenudom.js"></script> 
<script type="text/javascript" src="menu_data.js"></script> 
<script language="JavaScript1.2" type="text/javascript" src="preloadmenuimages.js"></script> 
<script src="insert_active_flash.js"></script>

Can you tell me where I'm going wrong?

[mcarlson]

Thanks for your help - those two changes made it work.

[Ruth]

Hi,

The menu looks as if you want it in a table, or between the tables. But, if you want it between and want it to remain there you need to put it in a table. This will require that the menu is placed relatively. Right now you have just called all the files at the bottom of the first table, and that will not work in most browsers. Try this:

1. create a new table below the one with the address image in it. You will call the files in this table, using your own paths to the files, of course. So, you'd have 3 tables, this 'menu' table between the top and bottom one you now have. You don't really need the preloadimages.js module since you only have those 5 images, but you can use it. It's not a problem.

Code: Select all

<table id=menu cellspacing=0 cellpadding=2 width=600 border=0>
<tr>
    <td><SCRIPT src="milonic_src.js" type=text/javascript></SCRIPT>
  <NOSCRIPT><A href="https://milonic.com/">JavaScript DHTML Menu Powered by 
  Milonic</A></NOSCRIPT>
  <SCRIPT src="mmenudom.js" type=text/javascript></SCRIPT>
  <SCRIPT src="menu_data.js" type=text/javascript></SCRIPT>

  <SCRIPT language=JavaScript1.2 src="preloadmenuimages.js" 
  type=text/javascript></SCRIPT>

  <SCRIPT src=""></SCRIPT></td>
</tr>
</table>

2. In the menu_data file add buildAfterLoad=true; at the top

Code: Select all

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=100;
_menuOpenDelay=0;
_subOffsetTop=0
_subOffsetLeft=-2;
buildAfterLoad=true;

3.create a new style for the main menu which is those images. The reason is so that you can 'center' the menu in the table so it looks centered between the two tables you have.

Code: Select all

with(mainStyle=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
offbgcolor="#ffffff";
offcolor="";
onbgcolor="#ffffff";
oncolor="";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=100);";
padding=0;
menubgcolor="transparent";
}

4. change the main menu coding at the top of that main menu to

Code: Select all

with(milonic=new menuname("home")){
alwaysvisible=1;
orientation="horizontal";
style=mainStyle;
position='relative';
menualign='center';
menuwidth='100%';

Hope this helps.

Ruth

[Kristy]

Ruth,
I think your suggestions are going to get the menus to appear, except I get a message saying "menuStyle is undefined" when I try to load them. I changed all the references from "menuStyle" to "mainStyle", but that didn't help. Can you give me more of your wonderful words of wisdom?
Here's the code:

Code: Select all

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=100;
_menuOpenDelay=0;
_subOffsetTop=0
_subOffsetLeft=-2;


with(mainStyle=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
offbgcolor="#ffffff";
offcolor="";
onbgcolor="#ffffff";
oncolor="";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=100);";
padding=0;
menubgcolor="transparent";
}

with(milonic=new menuname("home")){
alwaysvisible=1;
orientation="horizontal";
style=mainStyle;
position='relative';
menualign='center';
menuwidth='100%';
aI("image=/CES/images/smallHome_crayon.gif;url=/CES/index.htm;");
aI("showmenu=School;image=/CES/images/School_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Parents;image=/CES/images/smallParents_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Students;image=/CES/images/smallStudents_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Faculty;image=/CES/images/smallFaculty_crayon.gif;url=/CES/index.htm;");
}

with(milonic=new menuname("School")){
style=mainStyle;
aI("text=Activities & Programs;url=/CES/index.htm;");
aI("text=Administration;url=/CES/index.htm;");
aI("text=Curriculum;url=/CES/index.htm;");
aI("text=Faculty & Staff;url=/CES/index.htm;");
aI("text=History;url=/CES/index.htm;");
aI("text=Media Center;url=/CES/index.htm;");
aI("text=School Improvement Plan;url=/CES/index.htm;");
aI("text=School Map;url=/CES/index.htm;");
aI("text=School Newsletter;url=/CES/index.htm;");
}

[Kristy]

It's working now. Thanks so much for you help. I think the teachers are going to love it!

[Ruth]

Hi,

My fault. I should have been clearer about adding what I posted of the data file to the existing one so you had a mainStyle and a menuStyle.

I have found some issues and I am going to make a suggestion that you change the way you put the menu in the table. For some reason, if you use buildAfterLoad=true; which is needed for calling all files in the table, then some of the properties, like border are not working. So, I'm going to suggest the old method of doing it. I'll post everything here

1. copy and paste this to a file and save it as embed_main.js

Code: Select all

with(milonic=new menuname("home")){
alwaysvisible=1;
orientation="horizontal";
style=mainStyle;
position='relative';
menualign='center';
menuwidth='100%';
aI("image=smallHome_crayon.gif;url=/CES/index.htm;");
aI("showmenu=School;image=School_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Parents;image=smallParents_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Students;image=smallStudents_crayon.gif;url=/CES/index.htm;");
aI("showmenu=Faculty;image=smallFaculty_crayon.gif;url=/CES/index.htm;");
}
drawMenus();

2. copy and paste this and save it as subs_data.js

Code: Select all

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=100;
_menuOpenDelay=0;
_subOffsetTop=0
_subOffsetLeft=-2;

with(mainStyle=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
offbgcolor="#ffffff";
offcolor="";
onbgcolor="#ffffff";
oncolor="";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=100);";
padding=0;
menubgcolor="transparent";
}

with(milonic=new menuname("School")){
style=mainStyle;
aI("text=Activities & Programs;url=/CES/index.htm;");
aI("text=Administration;url=/CES/index.htm;");
aI("text=Curriculum;url=/CES/index.htm;");
aI("text=Faculty & Staff;url=/CES/index.htm;");
aI("text=History;url=/CES/index.htm;");
aI("text=Media Center;url=/CES/index.htm;");
aI("text=School Improvement Plan;url=/CES/index.htm;");
aI("text=School Map;url=/CES/index.htm;");
aI("text=School Newsletter;url=/CES/index.htm;");
}

with(milonic=new menuname("Parents")){
style=mainStyle;
aI("text=Calendar;url=/CES/index.htm;");
aI("text=CRCT Practice;url=/CES/index.htm;");
aI("text=Curriculum;url=/CES/index.htm;");
aI("text=Online Resources;url=/CES/index.htm;");
aI("text=PTO;url=/CES/index.htm;");
aI("text=School Council;url=/CES/index.htm;");
aI("text=Supply List;url=/CES/index.htm;");
aI("text=Tutorial Program;url=/CES/index.htm;");
}

with(milonic=new menuname("Students")){
style=mainStyle;
aI("text=Calendar;url=/CES/index.htm;");
aI("text=CRCT Practice;url=/CES/index.htm;");
aI("text=Lunch Menu;url=/CES/index.htm;");
aI("text=Online Resources;url=/CES/index.htm;");
}

with(milonic=new menuname("Faculty")){
style=mainStyle;
aI("text=Meet our Faculty & Staff;url=/CES/index.htm;");
aI("text=Online Resources for Faculty & Staff;url=/CES/index.htm;");
}

drawMenus();

You will now have two files, one contains only the main menu and one contains the styles and submenus.

3. On your page immediately after the body tag set these calls

Code: Select all

<SCRIPT src="milonic_src.js" type=text/javascript></SCRIPT>
  <NOSCRIPT><A href="https://milonic.com/">JavaScript DHTML Menu Powered by 
  Milonic</A></NOSCRIPT>
  <SCRIPT src="mmenudom.js" type=text/javascript></SCRIPT>
  <SCRIPT src="subs_data.js" type=text/javascript></SCRIPT>

4. In the 'menu' table that was created remove the calls for all the files and just put this call

Code: Select all

<SCRIPT src="embed_main.js"></SCRIPT>

This seems to fix the issue with some properties not working in the submenus.

++++++++++++++++
Just for fun and to give you some ideas, copy and paste the below code and save it as subs_test.js, and then call it in place of the subs_data.js file. This was just has some coloring and such for the submenus for you to see. You'll see what I did was create different styles for each submenu based on the original menuStyle and just changing bg colors and borders so the submenus 'matched' the color of the parent crayon. I also set the faculty submenu which is very wide to openstyle='rtl'; which made it open 'in' so it didn't go way beyond the parent crayon item. You do NOT have to use this, I just though you might like to see some of the things you can do. Below my name are links to the beginner's forum which has some very simple, short explanations about styles and how to create and use them.

Code: Select all

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=100;
_menuOpenDelay=0;
_subOffsetTop=0
_subOffsetLeft=-2;


with(mainStyle=new mm_style()){
bordercolor="#ffffff";
borderstyle="solid";
borderwidth=0;
fontfamily="Verdana, Tahoma, Arial";
fontsize="100%";
fontstyle="normal";
offbgcolor="#ffffff";
offcolor="";
onbgcolor="#ffffff";
oncolor="";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=100);";
padding=0;
menubgcolor="transparent";

}
with(schoolStyle=new mm_style()){
bordercolor="#000000";
borderstyle="outset";
borderwidth=2;
fontfamily="Verdana, Tahoma, Arial";
fontsize="100%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#66ccff";
offcolor="#000000";
onbgcolor="#000000";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=100);";
padding=5;
//pagebgcolor="#82B6D7";
pagebgcolor="#FFFFFF";
pagecolor="black";
separatorcolor="#000000";
separatorsize=1;
onborder="3px inset #66ccff";
}

parentStyle=new copyOf(schoolStyle);
parentStyle.offbgcolor="#ccff00";
parentStyle.onborder="3px inset #ccff00";

studentStyle=new copyOf(schoolStyle);
studentStyle.offbgcolor="#fff500";
studentStyle.onborder="3px inset #fff500";

facultyStyle=new copyOf(schoolStyle);
facultyStyle.offbgcolor="#e77817";
facultyStyle.onborder="3px inset #e77817";


with(milonic=new menuname("School")){
style=schoolStyle;
aI("text=Activities & Programs;url=/CES/index.htm;");
aI("text=Administration;url=/CES/index.htm;");
aI("text=Curriculum;url=/CES/index.htm;");
aI("text=Faculty & Staff;url=/CES/index.htm;");
aI("text=History;url=/CES/index.htm;");
aI("text=Media Center;url=/CES/index.htm;");
aI("text=School Improvement Plan;url=/CES/index.htm;");
aI("text=School Map;url=/CES/index.htm;");
aI("text=School Newsletter;url=/CES/index.htm;");
}

with(milonic=new menuname("Parents")){
style=parentStyle;
aI("text=Calendar;url=/CES/index.htm;");
aI("text=CRCT Practice;url=/CES/index.htm;");
aI("text=Curriculum;url=/CES/index.htm;");
aI("text=Online Resources;url=/CES/index.htm;");
aI("text=PTO;url=/CES/index.htm;");
aI("text=School Council;url=/CES/index.htm;");
aI("text=Supply List;url=/CES/index.htm;");
aI("text=Tutorial Program;url=/CES/index.htm;");

}

with(milonic=new menuname("Students")){
style=studentStyle;
aI("text=Calendar;url=/CES/index.htm;");
aI("text=CRCT Practice;url=/CES/index.htm;");
aI("text=Lunch Menu;url=/CES/index.htm;");
aI("text=Online Resources;url=/CES/index.htm;");
}

with(milonic=new menuname("Faculty")){
style=facultyStyle;
aI("text=Meet our Faculty & Staff;url=/CES/index.htm;");
aI("text=Online Resources for Faculty & Staff;url=/CES/index.htm;");
}

with(milonic=new menuname("Anti Spam")){
style=schoolStyle;
aI("text=Spam Cop;url=http://www.spamcop.net/;");
aI("text=Mime Defang;url=http://www.mimedefang.org/;");
aI("text=Spam Assassin;url=http://www.spamassassin.org/;");
}

with(milonic=new menuname("MyMilonic")){
style=schoolStyle;
aI("text=Login;url=http://milonic.com/login.php;");
aI("text=Licenses;url=http://milonic.com/mylicenses.php;");
aI("text=Invoices;url=http://milonic.com/myinvoices.php;");
aI("text=Make Support Request;url=http://milonic.com/reqsupport.php;");
aI("text=View Support Requests;url=http://milonic.com/mysupport.php;");
aI("text=Your Details;url=http://milonic.com/mydetails.php;");
}

drawMenus();

Hope this helps.

Ruth