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:53
Have Licence - menu Background and shadow
Poster: Athompson
Dated: Thursday September 28 2006 - 21:44:12 BST
Hello,
I have just bought a licence and im struggling a bit.
How do i make the MAIN menu buttons be images rather than colours. and the drop down part of the menu just a plain colour?
Also, is it possible to remove the shadow on the main menu and just have it on the actual drop down part of the menu? Here is my code:
Code:
<SCRIPT type="text/javascript" src="menu/milonic_src.js"></SCRIPT>
<script type="text/javascript">
<!--
if(ns4)_d.write("<SCR"+"IPT LANGUAGE=JavaScript SRC=menu/mmenuns4.js><\/SCR"+"IPT>");
else _d.write("<SCR"+"IPT LANGUAGE=JavaScript SRC=menu/mmenudom.js><\/SCR"+"IPT>");
-->
</SCRIPT>
<SCRIPT type="text/javascript">
_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_subOffsetTop=5 // Sub menu top offset
_subOffsetLeft=-5 // Sub menu left offset
with(menuStyle=new mm_style()){
onbgcolor="#4F8EB6";
oncolor="#ffffff";
offbgcolor="#DCE9F0";
offimage="#eeeeee";
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
separatorcolor="#2D729D";
separatorsize="1";
padding=4;
fontsize="75%";
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="black";
pagebgcolor="#82B6D7";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="menu/arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=90);";
}
<script type="text/javascript">
<!--
if(ns4)_d.write("<SCR"+"IPT LANGUAGE=JavaScript SRC=menu/mmenuns4.js><\/SCR"+"IPT>");
else _d.write("<SCR"+"IPT LANGUAGE=JavaScript SRC=menu/mmenudom.js><\/SCR"+"IPT>");
-->
</SCRIPT>
<SCRIPT type="text/javascript">
_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_subOffsetTop=5 // Sub menu top offset
_subOffsetLeft=-5 // Sub menu left offset
with(menuStyle=new mm_style()){
onbgcolor="#4F8EB6";
oncolor="#ffffff";
offbgcolor="#DCE9F0";
offimage="#eeeeee";
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
separatorcolor="#2D729D";
separatorsize="1";
padding=4;
fontsize="75%";
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="black";
pagebgcolor="#82B6D7";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="menu/arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=90);";
}
Any help appreciated!
Poster: Ruth
Dated: Friday September 29 2006 - 4:29:20 BST
Hi,
Athompson wrote:
How do i make the MAIN menu buttons be images rather than colours. and the drop down part of the menu just a plain colour?
We'd need more information than this since it depends on whether you are adding images that have text on them or an image that will be the background image on which you can type text.
If you are using a different image for each main menu item, then you need to put the code for the image into the actual item, i.e.
Code:
aI("image=home.gif;url=whatever;");
aI(image=help.gif;showmenu=whatever;");
aI(image=help.gif;showmenu=whatever;");
If you are using a background image and it will be the same for all main menu items then you can put the code in the menuStyle, i.e. bgimage="whatever.gif";
You would then need to create a second style that is for the submenus, say you call it subStyle. The easiest way is to copy and paste the menuStyle right below itself and then rename it and change whatever properties you want to be different. Then in each submenu you'd put style=subStyle; in place of menuStyle.
As to the shadow, I do not see that coded anyplace, that is in the overfilter= section. I see Fade and Alpha, but no shadow coded. If you want a shadow in the submenus, you'd put in the overfilter= code for shadow. Overfilter and outfilter are proprietary to IE, they will only show on IE.
You can go to the IE FILTERS Demo Tool which allows you to play with all the filters and transitions for IE and will output the code so you can just copy and paste it to the style where you want it.
I also suggest you take a quick look here http://www.milonic.com/forum/viewforum.php?f=14 and read the sections on Styling the Menu Parts I, II, and III. They are a quick read and will help you with creating styles.
Finally, in the code you posted you have offimage="#eeeeee"; There is no such property in the menu.
If you can provide a test page and the info and images you want, I can set something up for you to check.
Ruth
Poster: Athompson
Dated: Monday October 2 2006 - 18:06:34 BST
Works a gem - thanks
Few problems. Im using this code:
Code:
aI("image=home.gif;url=whatever;");
aI(image=help.gif;showmenu=whatever;");
aI(image=help.gif;showmenu=whatever;");
Like you suggested, however, the links that drop into submenus, the bg is a colour where the arrow is.
Also, i am now using this code on the html page:
Code:
<!-- MENU CODE -->
<script type="text/javascript" src="menu/milonic_src.js"></script>
<script type="text/javascript">
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=menu/mmenuns4.js><\/scr"+"ipt>");
else _d.write("<scr"+"ipt type=text/javascript src=menu/mmenudom.js><\/scr"+"ipt>");
</script>
<script type="text/javascript" src="menu/menu_data.js"></script>
<!-- MENU CODE -->
<script type="text/javascript" src="menu/milonic_src.js"></script>
<script type="text/javascript">
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=menu/mmenuns4.js><\/scr"+"ipt>");
else _d.write("<scr"+"ipt type=text/javascript src=menu/mmenudom.js><\/scr"+"ipt>");
</script>
<script type="text/javascript" src="menu/menu_data.js"></script>
<!-- MENU CODE -->
The drop down menu isnt appearing now ive moved the menu data to the menu_data.js file.
please advise.
Poster: John
Dated: Monday October 2 2006 - 19:47:18 BST
A URL, as requested, would make it a lot easier for us to help you.
Poster: Athompson
Dated: Monday October 2 2006 - 20:11:53 BST
Sorry,
How can i contact you privatly, as this info can not be placed in the public domain...
NB: I have a licence...
Poster: Athompson
Dated: Tuesday October 3 2006 - 7:32:10 BST
Sorry,
How can i contact you privatly, as this info can not be placed in the public domain...
NB: I have a licence...
Poster: Ruth
Dated: Tuesday October 3 2006 - 18:43:11 BST
Hi,
You have an error in the menu_data.js file. At the top the // has been removed. Fix that and see if it works. It should be
Code:
fixMozillaZIndex=true; //scrolling problem, toggle to see if it helps
Ruth
Poster: Athompson
Dated: Tuesday October 3 2006 - 19:35:04 BST
Thanks Ruth,
I have updated the URL that was sent in the email, if you look, ive changed from using the image to using a BG image with text on the top. Is there anyway to stop the background image on the actual submenu's from being the same bg image as the main menu items and simply have a plain colour.
Also, because its text, id like to have some sort of divide between each menu name. Id want an "|" possibly between each main menu item, how would i achieve this?
Poster: Athompson
Dated: Tuesday October 3 2006 - 21:52:57 BST
and thanks again for the help you've been offering!
Poster: Ruth
Dated: Tuesday October 3 2006 - 22:41:28 BST
Hi,
I have put together your page with the stuff in the data file. Because I work on my desktop everything is in the same folder, so when you get the zip file you'll need to put everything in one folder to see and test it.
From the data file you should be able to see what I did.
[Link Removed]
Hope this helps.
Ruth