Solved

popup menu - how to make sub menus somewhat transparent

Posted on 2004-04-25
4
13,303 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
ID: 10915600
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
ID: 10916173
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
ID: 10919044
thank you so much!  
0
 
LVL 5

Expert Comment

by:bitter_chicken
ID: 10919525
:-)
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

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 …
Adobe Dreamweaver CS5 is a WYSIWYG web page editor that has advanced HTML, CSS, and Javascript rendering functionality and is probably the most well-known HTML editor available. Much of Dreamweaver's appeal centers around the Design View interfac…
This Micro Tutorial will give you a basic overview how to record your screen with Microsoft Expression Encoder. This program is still free and open for the public to download. This will be demonstrated using Microsoft Expression Encoder 4.

825 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