Industrial Strength JavaScript and DHTML Menus
About Us
Testimonials
Contact Us
Our Distinguished Clients
Investing in Non-Profits
Where Are We
Privacy Policy
Software Licensing Agreement
DHTML JavaScript Menu
Product Information
Page Integration
Quick Reference Guides
Embedding Into a Table or DIV
Purchase
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:18
Menu wont stay locked on screen
Poster: Jay1395
Dated: Wednesday January 11 2006 - 19:46:35 GMT
Hi-
I'm working on a site for my volunteer ems and it is a centered site where the site isnt anchored to the left. So when i specify where the menu is on the screen when the site is maximized it is in a different place then when the screen is resized because it is less pixels from the left side. Any ideas on how to fix this?
Jason
Poster: vikenk
Dated: Wednesday January 11 2006 - 20:25:39 GMT
Can you post an example URL, so we can see what's happening?
surely
Poster: Jay1395
Dated: Wednesday January 11 2006 - 20:27:29 GMT
Here is the problem:
http://www.vems.org/training.html
Now when the screen is maximized it is sorta in the right place but when you resize the window it moves to the right.
Poster: vikenk
Dated: Wednesday January 11 2006 - 21:21:08 GMT
Jason,
I'm sorry, but I don't quite understand what you're trying to do with the site. What I see is two menus on top of eachother. One is your table-based menu:
Code:
<td height="206" colspan="2" rowspan="2" align="center" valign="bottom" background="images/04.gif"><table width="90%" border="0" cellspacing="3" cellpadding="10">
<tr>
<td background="images/menubg.gif"><strong><a href="index.html">Home</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="ourservice.html">Our Service</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="#"> Alumni </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="pictures.html">Pictures</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="training.html">Training - CPR </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="index.html">Home</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="ourservice.html">Our Service</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="#"> Alumni </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="pictures.html">Pictures</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="training.html">Training - CPR </a></strong></td>
</tr>
...and ther other is the Milonic menu. Is there a reason that you're putting both menus on top of eachother? In any case: For this application, a relatively placed Milonic menu is your best choice. What you would do is load the Main Menu *only* in the table, and add position="relative"; to the menu. So, your <td> should look like this:
Code:
<td><script type="text/javascript>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();</script></td>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();</script></td>
The rest of the code should remain in the menu_data.js file. This will allow the menu to expand and collapse with the table. See http://www.milonic.com/menusample9.php for more info on relative positioned menus. You can see how the script works.
Also, in your <head> section, the Milonic source files are interrupted by a style:
Code:
<script type="text/javascript" src="milonic_src.js"></script>
<style type="text/css">
<!--
.style2 {color: #ACACAC}
.style10 {color: #6A6A6A}
-->
</style>
<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 type="text/javascript" src="menu_data.js"></script>
<style type="text/css">
<!--
.style2 {color: #ACACAC}
.style10 {color: #6A6A6A}
-->
</style>
<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 type="text/javascript" src="menu_data.js"></script>
Move .style2 and .style10 out and place it either before or after the Milonic files. I'm not sure if it'll make a huge difference, but the Milonic source files should be continuous.
Hope this helps,
Viken K.
Poster: Jay1395
Dated: Wednesday January 11 2006 - 21:31:33 GMT
thanks so much, the reason for the two menus is the text on is the original and i am just testing the java one right now and i was just fooling around with placement. thanks for your help
Poster: Jay1395
Dated: Wednesday January 11 2006 - 22:04:09 GMT
So i tried what you suggested, but if you look it seems to distort the whole page. any ideas?
vikenk wrote:
Jason,
I'm sorry, but I don't quite understand what you're trying to do with the site. What I see is two menus on top of eachother. One is your table-based menu:
...and ther other is the Milonic menu. Is there a reason that you're putting both menus on top of eachother? In any case: For this application, a relatively placed Milonic menu is your best choice. What you would do is load the Main Menu *only* in the table, and add position="relative"; to the menu. So, your <td> should look like this:
The rest of the code should remain in the menu_data.js file. This will allow the menu to expand and collapse with the table. See http://www.milonic.com/menusample9.php for more info on relative positioned menus. You can see how the script works.
Also, in your <head> section, the Milonic source files are interrupted by a style:
Move .style2 and .style10 out and place it either before or after the Milonic files. I'm not sure if it'll make a huge difference, but the Milonic source files should be continuous.
Hope this helps,
Viken K.
I'm sorry, but I don't quite understand what you're trying to do with the site. What I see is two menus on top of eachother. One is your table-based menu:
Code:
<td height="206" colspan="2" rowspan="2" align="center" valign="bottom" background="images/04.gif"><table width="90%" border="0" cellspacing="3" cellpadding="10">
<tr>
<td background="images/menubg.gif"><strong><a href="index.html">Home</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="ourservice.html">Our Service</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="#"> Alumni </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="pictures.html">Pictures</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="training.html">Training - CPR </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="index.html">Home</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="ourservice.html">Our Service</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="#"> Alumni </a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="pictures.html">Pictures</a></strong></td>
</tr>
<tr>
<td background="images/menubg.gif"><strong><a href="training.html">Training - CPR </a></strong></td>
</tr>
...and ther other is the Milonic menu. Is there a reason that you're putting both menus on top of eachother? In any case: For this application, a relatively placed Milonic menu is your best choice. What you would do is load the Main Menu *only* in the table, and add position="relative"; to the menu. So, your <td> should look like this:
Code:
<td><script type="text/javascript>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();</script></td>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();</script></td>
The rest of the code should remain in the menu_data.js file. This will allow the menu to expand and collapse with the table. See http://www.milonic.com/menusample9.php for more info on relative positioned menus. You can see how the script works.
Also, in your <head> section, the Milonic source files are interrupted by a style:
Code:
<script type="text/javascript" src="milonic_src.js"></script>
<style type="text/css">
<!--
.style2 {color: #ACACAC}
.style10 {color: #6A6A6A}
-->
</style>
<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 type="text/javascript" src="menu_data.js"></script>
<style type="text/css">
<!--
.style2 {color: #ACACAC}
.style10 {color: #6A6A6A}
-->
</style>
<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 type="text/javascript" src="menu_data.js"></script>
Move .style2 and .style10 out and place it either before or after the Milonic files. I'm not sure if it'll make a huge difference, but the Milonic source files should be continuous.
Hope this helps,
Viken K.
Poster: Ruth
Dated: Wednesday January 11 2006 - 23:56:02 GMT
Hi Jay,
The main menu needs to be only in the table cell. Remove it from the menu_data.js file. Also, the call for the menu files should be the first thing after the body tag rather than in the head.
Ruth
Poster: Jay1395
Dated: Thursday January 12 2006 - 3:32:55 GMT
I have tried this also, to no avail:
to get a better aspect here are two pages, before the script http:\\www.vems.org/training.html and after the script http:\\www.vems.org/training1.html
Poster: vikenk
Dated: Thursday January 12 2006 - 3:56:22 GMT
Code:
http:\\www.vems.org/training1.html
This links doesn't work. Also, is the first link supposed to have the menu in it?
Viken K.
Poster: Jay1395
Dated: Thursday January 12 2006 - 4:01:28 GMT
first link no menu, second link menu. sorry, they both work now
Poster: vikenk
Dated: Thursday January 12 2006 - 4:14:58 GMT
Code:
<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 type="text/javascript" src="menu_data.js"></script>
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 type="text/javascript" src="menu_data.js"></script>
You forgot to include the Menu source file :>) The very first script item should be:
<script type="text/javascript" src="milonic_src.js"></script>
Then:
<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>
Then:
<script type="text/javascript" src="menu_data.js"></script>
Try again one more time. I'll be up for a few more minutes.
Viken K.
Poster: vikenk
Dated: Thursday January 12 2006 - 4:34:41 GMT
Copy this code to your page, in the appropriate place. I got it to work:
Code:
<table width="100%" height="100%" border="0">
<tr>
<th height="244" scope="col"></th>
<td>
<script type="text/javascript">
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();
</script></td></th>
</tr>
</table>
<tr>
<th height="244" scope="col"></th>
<td>
<script type="text/javascript">
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
position="relative";
orientation="vertical";
aI("status=Back To Home Page;text=Home;url=http://www.vems.org/;");
aI("showmenu=Our Service;text=Our Service;");
aI("showmenu=Alumni;text=Alumni;");
aI("showmenu=Services;text=Services;");
aI("status=Pictures;text=Pictures;url=http://www.vems.org/pictures.html;")
aI("showmenu=Training;text=Training;");
}
drawMenus();
</script></td></th>
</tr>
</table>
Try it out.
Viken K.