Solved

popup menu - how to make sub menus somewhat transparent

Posted on 2004-04-25
4
13,295 Views
Last Modified: 2012-05-04
I'd like to use the pop up menu maker in dreamweaver.  I wonder how to make the sub-menus more transparent.  I've seen this effect on some sites, although I don't know if it was done in Dreamweaver.  I use version 2004.  I know it has to do with layers.  If it is not possible to use the default tool in the program, is there some other way to reduce the opacity of the submenus?  How can I identify the appropriate place?


It seems very pleasing to me since it does not entirely cover the contents of the page while navigation is being used.
0
Comment
Question by:linque
  • 2
4 Comments
 
LVL 20

Expert Comment

by:trailblazzyr55
Comment Utility
Hi,

Here ya go, there isn't really a tool in dreamweaver to do this for you but here are a couple links to what you're talking about:

http://www.likno.com/examples.html  (have a look around the site)
http://javascript.internet.com/navigation/cascade-menu.html

Hope this helps,
Regards,
~trail
0
 
LVL 5

Accepted Solution

by:
bitter_chicken earned 500 total points
Comment Utility
Hey linque:

The solution is to change one of the style tags in the mm_menu.js file.

Create your menus, and dreamweaver should make a new file called 'mm_menu.js'.
Open the file, and scroll to line 121, which should look like this:
======================
'<div id="menuLayer'+ countMenus +'" style="position:absolute;z-index:1;left:10px;top:'+ (i * 100) +'px;visibility:hidden;color:' +  menu.menuBorderBgColor + ';">\n'+
======================

Simply replace that line with this modified one:
======================
'<div id="menuLayer'+ countMenus +'" style="position:absolute;z-index:1;left:10px;filter:Alpha(Opacity=50);-moz-opacity:0.5;top:'+ (i * 100) +'px;visibility:hidden;color:' +  menu.menuBorderBgColor + ';">\n'+
======================

Note there are 2 more CSS attributes added:
1. filter:Alpha(Opacity=50);
   This is for compatability with IE 4+. (note: this is set to opacity = 50%)
2. -moz-opacity:0.5;
   This is for compatability with Netscape 6+, and Mozilla (note: this is also set to opacity = 50%; slightly different syntax)

The great thing about just changing the .js file is that you can still change items, add new items, change colors etc... in dreamweaver without any problems.

Hope this has helped,
bc :-)
0
 

Author Comment

by:linque
Comment Utility
thank you so much!  
0
 
LVL 5

Expert Comment

by:bitter_chicken
Comment Utility
:-)
0

Featured Post

Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

Join & Write a Comment

For those who don't know, Adobe Dreamweaver is a popular commercial web editor that enables you to design, build and manage complex websites. The editor is a WYSIWYG (What You See Is What You Get) web editor, which means that you can create your web…
I still run into .cgi files every now and then. In some instances, I actually prefer the simplicity of a .cgi script to other options. Since I use DreamWeaver extensively, what I needed was a way to open .cgi scripts in Dreamweaver. And I wanted to …
Polish reports in Access so they look terrific. Take yourself to another level. Equations, Back Color, Alternate Back Color. Write easy VBA Code. Tighten space to use less pages. Launch report from a menu, considering criteria only when it is filled…
This tutorial demonstrates a quick way of adding group price to multiple Magento products.

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now