Expanding menu bar help

i have search for about 2-3hrs and cant figure out how to create a vertical expanding navigation bar like the one on www.louisvuitton.com on their main page there is a menu box on the right and when you put your mouse over it it expands allowing you to choose you country. i want to make this horizontal, not sure what this is called so i might have been searching for the wrong thing but any help in finding a tutorial would be great thanks

You will lose a lot of Google's ability to map your site unless you submit a special site map to the search engine (see mine under www.aloe-vera.org/public_.xml ).
To submit a sitemap to Google you need a google account (such as Gmail) and then go to: www.google.com/webmasters/tools to submit your sitemap. This will help to balance having a Flash menu.
I would love to see your menu when it is done! Best wishes, David
Read the Top 10 Benefits of Drinking Aloe Vera Juice.
If
you have any questions about the benefits of drinking Aloe Vera, please
call 1-866-750-ALOE (2563) any day but Sunday. (We are L.D.S.)
Date: Fri, 3 Jun 2011 13:44:39 -0600
From: [email protected]
To: [email protected]
Subject: expanding menu bar help
google
Build a Versatile ActionScript 3.0 Menu with Masking
here is the link http://active.tutsplus.com/tutorials/web-design/build-a-versatile-actionscript-30-menu-wit h-masking/
ill have to mess with it some but it just about what i was looking for
>

Similar Messages

Spry Menu Bar - Help Request

Hello!
I'm using a horizontal spry menu bar with horizontal sub menu
and have almost gotten the navigation exactly how I need it. I'm
stuck, however, and don't know how to fix the following:
1. I have absolute positioning set for my sub menu so that
the items appear under the left-most main menu item instead of
their parent item. When I change screen sizes, the sub menu stays
put (as it should) and everything else moves with the re-size. I
can't figure out where the sub menu positioning is originally set
to change it or how to get it to appear where it currently is
without using absolute positioning.
2. I would like to center the contents of the sub menu and I
think I've tried text-align:center everywhere possible but to no
avail. Any suggestions would be greatly appreciated!
3. Is there any way that the menu can recongnize the page
that it's on and display the appropriate link high-lighted. For
example, when you open the home page the active/focus state for the
"Home" button shows (for this menu it would be a different color
background image) and it's corresponding sub menu would be
displayed automatically. Would a script do it? Is there anything
like this available?
The following is the page code and accompanying css. I have
not altered the js file. I apologize for not being able to provide
a link, but may be able to do so this evening.
Thanks in advance for your help!
Stephi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>ContraCostaTest</title>
<script src="SpryAssets/SpryMenuBar.js"
type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css"
rel="stylesheet" type="text/css" />
<link href="Style/style.css" rel="stylesheet"
type="text/css" />
<style>
#container{width:800px; margin:0 auto 0 auto;}
#content{width:714px; background-color:white;margin:22px 0 0
0;color:#CCCCCC; font-size:10px}
#navbar{padding:0 0 32px 0; *margin:0 0 -32px 0; }
</style>
</head>
<body>
<div id="container">
<div id="navbar">
<ul id="MainMenu" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu"
href="#">Home<br /> </a>
<ul>
<li><a href="#">About Us <span> |
</span></a></li>
<li><a href="#"> Contact Us <span> |
</span></a></li>
<li><a href="#"> ATM Locator <span> |
</span></a></li>
<li><a href="#"> News <span> |
</span></a></li>
<li><a href="#"> Links <span> |
</span></a></li>
<li><a href="#"> Join <span> |
</span></a></li>
<li><a href="#"> Employment</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Loans
&Rates</a>
<ul>
<li><a href="#">Consumer Loans <span> |
</span></a></li>
<li><a href="#"> VISA <span> |
</span></a></li>
<li><a href="#"> Mortgage Loans <span> |
</span></a></li>
<li><a href="#"> Auto Buying
Center</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu"
href="#">Checking & Savings</a>
<ul>
<li><a href="#">Regular Savings <span> |
</span></a> </li>
<li><a href="#"> Checking <span> |
</span></a></li>
<li><a href="#"> IRA <span> |
</span></a></li>
<li><a href="#"> Share Certificates <span>
| </span></a></li>
<li><a href="#"> Club Accounts <span> |
</span></a></li>
<li><a href="#"> Rates</a></li>
</ul>
</li>
<li><a href="#"
class="MenuBarItemSubmenu">Electronic Services</a>
<ul>
<li><a href="#">@ccessOnline <span> |
</span></a></li>
<li><a href="#"> BillPay <span> |
</span></a></li>
<li><a href="#"> Direct Deposit &
Payroll Deduction <span> | </span></a></li>
<li><a href="#"> Automatic Bill Payments
<span> | </span></a></li>
<li><a href="#"> ATM or MasterMoney <span>
| </span></a></li>
<li><a href="#"> Access
Line</a></li>
</ul>
</li>
<li><a href="#"
class="MenuBarItemSubmenu">Locations<br />
</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Forms
& Applications</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Auto
Buying Center</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
</ul>
</div>
<div id="content">This is a test. This is a test. This
is a test. This is a test. This is a test. This is a test. This is
a test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test.
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>
@charset "UTF-8";
ul.MenuBarHorizontal
margin: 0 auto 0 auto;
padding: 0; /*NOTE: removing this item causes menu bar to
shift right in FF. wierd...*/
list-style-type: none;
font-size: .7em;
cursor: default;
ul.MenuBarActive
z-index: 1000;
ul.MenuBarHorizontal li
list-style-type: none;
font-size: 100%;
text-align: center;
cursor: pointer;
width: 9.1em;
float: left;
ul.MenuBarHorizontal ul
margin: 0 auto 0 auto;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
position: absolute;
left: 112px;
*left: 101px;
border:#CC0033 1px solid;
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: 112px;
*left: 101px;
z-index: 1030;
/*NOTE: submenu set at higher z-index than for
ul.MenuBarHorizontal ul above at 1020 to display*/
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-image:url(../Images/BGup_03.gif);
color: #333;
text-decoration: none;
height:30px;
padding-top:2px;
text-align:center;
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #FFF;
background-image:url(../Images/BGover_03.gif);
ul.MenuBarHorizontal iframe{
position: absolute;
left: 112px;
*left: 101px;
ul.MenuBarHorizontal ul{
background-color:#999999;
width:714px; /*NOTE:setting a width keeps submenu
horizontal*/
ul.MenuBarHorizontal li li{
width:auto;
ul.MenuBarHorizontal li li a{
background-color:#999999;
height:20px;
background-image:none;
margin-left:5px;
ul.MenuBarHorizontal li li a span{
color:black;
ul.MenuBarHorizontal li li a:hover, ul.MenuBarHorizontal li
ul li a:focus{
color:white;
height:20px;
background-image:none;
Text

Hello!
I'm using a horizontal spry menu bar with horizontal sub menu
and have almost gotten the navigation exactly how I need it. I'm
stuck, however, and don't know how to fix the following:
1. I have absolute positioning set for my sub menu so that
the items appear under the left-most main menu item instead of
their parent item. When I change screen sizes, the sub menu stays
put (as it should) and everything else moves with the re-size. I
can't figure out where the sub menu positioning is originally set
to change it or how to get it to appear where it currently is
without using absolute positioning.
2. I would like to center the contents of the sub menu and I
think I've tried text-align:center everywhere possible but to no
avail. Any suggestions would be greatly appreciated!
3. Is there any way that the menu can recongnize the page
that it's on and display the appropriate link high-lighted. For
example, when you open the home page the active/focus state for the
"Home" button shows (for this menu it would be a different color
background image) and it's corresponding sub menu would be
displayed automatically. Would a script do it? Is there anything
like this available?
The following is the page code and accompanying css. I have
not altered the js file. I apologize for not being able to provide
a link, but may be able to do so this evening.
Thanks in advance for your help!
Stephi
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>ContraCostaTest</title>
<script src="SpryAssets/SpryMenuBar.js"
type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css"
rel="stylesheet" type="text/css" />
<link href="Style/style.css" rel="stylesheet"
type="text/css" />
<style>
#container{width:800px; margin:0 auto 0 auto;}
#content{width:714px; background-color:white;margin:22px 0 0
0;color:#CCCCCC; font-size:10px}
#navbar{padding:0 0 32px 0; *margin:0 0 -32px 0; }
</style>
</head>
<body>
<div id="container">
<div id="navbar">
<ul id="MainMenu" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu"
href="#">Home<br /> </a>
<ul>
<li><a href="#">About Us <span> |
</span></a></li>
<li><a href="#"> Contact Us <span> |
</span></a></li>
<li><a href="#"> ATM Locator <span> |
</span></a></li>
<li><a href="#"> News <span> |
</span></a></li>
<li><a href="#"> Links <span> |
</span></a></li>
<li><a href="#"> Join <span> |
</span></a></li>
<li><a href="#"> Employment</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Loans
&Rates</a>
<ul>
<li><a href="#">Consumer Loans <span> |
</span></a></li>
<li><a href="#"> VISA <span> |
</span></a></li>
<li><a href="#"> Mortgage Loans <span> |
</span></a></li>
<li><a href="#"> Auto Buying
Center</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu"
href="#">Checking & Savings</a>
<ul>
<li><a href="#">Regular Savings <span> |
</span></a> </li>
<li><a href="#"> Checking <span> |
</span></a></li>
<li><a href="#"> IRA <span> |
</span></a></li>
<li><a href="#"> Share Certificates <span>
| </span></a></li>
<li><a href="#"> Club Accounts <span> |
</span></a></li>
<li><a href="#"> Rates</a></li>
</ul>
</li>
<li><a href="#"
class="MenuBarItemSubmenu">Electronic Services</a>
<ul>
<li><a href="#">@ccessOnline <span> |
</span></a></li>
<li><a href="#"> BillPay <span> |
</span></a></li>
<li><a href="#"> Direct Deposit &
Payroll Deduction <span> | </span></a></li>
<li><a href="#"> Automatic Bill Payments
<span> | </span></a></li>
<li><a href="#"> ATM or MasterMoney <span>
| </span></a></li>
<li><a href="#"> Access
Line</a></li>
</ul>
</li>
<li><a href="#"
class="MenuBarItemSubmenu">Locations<br />
</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Forms
& Applications</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Auto
Buying Center</a>
<ul>
<li><a href="#"> </a></li>
</ul>
</li>
</ul>
</div>
<div id="content">This is a test. This is a test. This
is a test. This is a test. This is a test. This is a test. This is
a test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test. This is a test. This is a test. This is a
test. This is a test.
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>
@charset "UTF-8";
ul.MenuBarHorizontal
margin: 0 auto 0 auto;
padding: 0; /*NOTE: removing this item causes menu bar to
shift right in FF. wierd...*/
list-style-type: none;
font-size: .7em;
cursor: default;
ul.MenuBarActive
z-index: 1000;
ul.MenuBarHorizontal li
list-style-type: none;
font-size: 100%;
text-align: center;
cursor: pointer;
width: 9.1em;
float: left;
ul.MenuBarHorizontal ul
margin: 0 auto 0 auto;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
position: absolute;
left: 112px;
*left: 101px;
border:#CC0033 1px solid;
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: 112px;
*left: 101px;
z-index: 1030;
/*NOTE: submenu set at higher z-index than for
ul.MenuBarHorizontal ul above at 1020 to display*/
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-image:url(../Images/BGup_03.gif);
color: #333;
text-decoration: none;
height:30px;
padding-top:2px;
text-align:center;
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #FFF;
background-image:url(../Images/BGover_03.gif);
ul.MenuBarHorizontal iframe{
position: absolute;
left: 112px;
*left: 101px;
ul.MenuBarHorizontal ul{
background-color:#999999;
width:714px; /*NOTE:setting a width keeps submenu
horizontal*/
ul.MenuBarHorizontal li li{
width:auto;
ul.MenuBarHorizontal li li a{
background-color:#999999;
height:20px;
background-image:none;
margin-left:5px;
ul.MenuBarHorizontal li li a span{
color:black;
ul.MenuBarHorizontal li li a:hover, ul.MenuBarHorizontal li
ul li a:focus{
color:white;
height:20px;
background-image:none;
Text

Horizontal Menu Bar Help Needed

Hi there, I am somewhat new to web design but I've been helping a friend update his business's page recently. We use Dreamweaver CS3 and our hosting is thru GoDaddy.
My problem appears when I try to insert a horizontal menu bar (Insert>Spry>Menu bar) so that a dropdown menu will appear when I hover over an option, much like the top menu on the GoDaddy homepage, among others. It works correctly when I preview my page in a browser from Dreamweaver, (Firefox, IE) but when I actually upload my page to the GoDaddy servers and view it, it shows up not as a bar with hidden options, but as a long unformatted vertical list.
The site in question is here: http://www.notyouraveragebookkeeper.com/indextabs
I thought it might be a problem with CSS, but I made sure that all of the style sheets are properly uploaded to the servers, and I made sure that my browser accepted any Javascript applets. I've also tried it with my Dreamweaver CS5 trial. Like I said, I am an amateur in every sense of the word and I'm still learning technical terms for things so some of my jargon may be a bit flawed. I have done a good bit of online research in forums and otherwise, and I've tried solutions that have been given to similar problems. Maybe someone could view the source code and find out where I've gone wrong, or suggest tips to identify problems in Dreamweaver. I feel like the problem lies within the Spry framework, but I have very little knowledge on how it works or what it does.
Any assistance in this regard would be extremely helpful and appreciated.

Neither SpryMenuBar.js and SpryMenuBarHorizontal.css can be found by your online site.
Possibly these have not been uploaded or uploaded to a wrong location.
Gramps

Menu bar help

Can anyone help me!!!
I seem to have messed up the menu bar of the RoboHelp for
Word x5.
The RoboHelp pulldown from the menu bar does appear.
I have reinstalled Robohelp x5 and the updates but with no
luck.
PLEASE CAN SOMEONE PUT ME OUT OF MY MISERY
regards
Sean

Firstly, look at this Knowledge base article:
Are you pointing to the following template on template and
addins?
C:\Documents and Settings\cclarke\Application
Data\Microsoft\Templates\Robohelp.dot
http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=rb_100001
Does this help?
Now look at this thread:
http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?forumid=65&catid=448&threadid =1143700&enterthread=y
Hope these help
Kind Regards
Craig

Missing airport icon in menu bar HELP PLEASE

Okay, I have a g4 powerbook that came with tiger.
I am missing the airport icon that once was there in the menu bar at the top right-hand side.
What I've done: ran disk utility, = all's well, check for software updates = all's well there too., and the most obvious, check the box under system pref. for airport config.
I check it and it is does, nothing. I go back to system pref. and is unchecked again.
IM AT A LOSS. Anyone with this problem PLEASE help.
thanks...

muecyl,
Do not concern yourself with the other files that you found at that location. Just leave them where they are.
Since your problem is also related to some extent to System Preferences, you may benefit from trying the procedures outlined by Dr. Smoke in Try the following....
Another possibility is to download and reinstall the Mac OS X 10.4.6 Combo for PPC.
;~)

The airplay icon has disappeared from my menu bar, help?

Not sure how it happened but the airplay icon has disappeared from my menu bar, !! can anyone help.
I logged out and restarted but still not appearing.

Thank you.
What i ended up doing was,t switch the power supply off to my modem , wait a minute, switch back on and reboot my macbook, lo and behold everthing is back to normal!!
Thanks for offering help.
Jim-amberco

SPry menu bar help

I have recently migrated from MS frontpage '03 to Dreamweaver
CS3. I must admit , for a novice at WYSIWYG and a complete beginner
at the html code, this transition was not as easy as I expected.
However after purchasing a few books, and viewing some of the vids
of adobe , I finally got the hang of things.
I am busy designing a school website, using one of the html
templates offered by DW CS3 (two coloumns elastic,right sidebar,
header and footer). I have inserted a spry horizonal Navigation bar
under the banner(which is a jpg). Both th espry navigation and the
banner is in the header part of the html template.
I have encountered three probs:
1) I cant change the colour of the spry menu bar and its drop
down menu. When I look at the code/split view, I do not see any
code relating to the color of the menu bar (ie. #999999).
2) I dont seem to know how to align the spry menu directly
under the banner. (there is a slight space between the banner and
the spry menu )
3) Also there is a slight grey space on top and at the bottom
of the banner (even after I set the padding to 0px)
A reply would be highy appreciated
Text
Text
gg

Hi Zenoneath,
Possible answers to your probs:
1. Using the spry menubar, you also are linked to a
sprymenubarhorizontal.css (look in your HEAD code), the css is
located in the spryassets dir. Read the grey text between the css
code and you find your answer to the colors.
2. Perhaps within the same CSS you can position the menubar
exactly. otherwise place the complete menubarcode in a div and give
this div a classname and position it within a css stylesheet.
3. Most likely, using a DW template, your already linked to a
specific CSS file wich is combined with the template. In that CSS
file you will find the headerdiv, and can change bg color there.
Looks like it all about CSS... life is simple...sometimes.
Hope it will work for you!
Hans

Spry menu bar woes (add submenu levels and edit width)

So i need some spry menu bar help. Apparently as a graphic designer i'm also expected to webdesign, and while i can solve most problems with a good googling, i seem to be at my wit's end fo this one. So the site i'm doing has a header ith a horizontal spry pop-up menubar (in Dreamweaver CS4). But some problems arise: when i manually add another submenu level, they don't show up in chrome or FF, they do werk perfectly in IE6. I just add the following code to the codepage:
<li><a href="#" class="MenuBarItemSubmenu">audio equipment</a>             <ul>               <li><a href="#">Digital Matrix Systems</a></li>               <ul>               <li><a href="#">R2 Digital Audio Matrix</a></li>               </ul>               <li><a href="#">pre-amplifiers & mixers</a></li>               <ul>               <li><a href="#">PMX124</a></li>               </ul>
the PMX never pops open in FF an chrome.. Should i be adding anything else to another part of the code? i'd like my submenu text to have a slight indent? How ever, when i add the indent to ul.menubarhorizontal ul , it elongates the submeny boxes in IE6, while looking normal (width) in chrome and FF. WHat part of the CSS style should i change to just have the text scoot over a bit without it really affecting the box layout? ALso, if anyone could tell me how to add a wee bit of spacing above the text (and beneath), i'd be eternally gratefull. Also, how do i change the with of the submenus? seing as my main buttons are images, but the names i ned to put in my submenus are turning out to be pretty long...
HTML code for the menu:
<tr>     <td><ul id="MenuBar1" class="MenuBarHorizontal">       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Products','','images/knoppenrollover_01.jpg',1)"><img src="images/knoppenbalk_01.jpg" name="Products" width="169" height="41" border="0" id="Products" /></a>         <ul>           <li><a href="#" class="MenuBarItemSubmenu">audio equipment</a>             <ul>               <li><a href="#">Digital Matrix Systems</a></li>               <ul>               <li><a href="#">R2 Digital Audio Matrix</a></li>               </ul>               <li><a href="#">pre-amplifiers & mixers</a></li>               <ul>               <li><a href="#">PMX124</a></li>               </ul>               <li><a href="#">music Sources</a></li>               <li><a href="#">amplifiers</a></li>               <li><a href="#">paging</a></li>               <li><a href="#">speakers</a></li>               <li><a href="#">microphones</a></li>             </ul>           </li>           <li><a href="#">racks and stands</a></li>           <li><a href="#">cables</a></li>         </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Company','','images/knoppenrollover_02.jpg',1)"><img src="images/knoppenbalk_02.jpg" name="Company" width="165" height="41" border="0" id="Company" /></a>         <ul>           <li><a href="#">Who are we?</a></li>           <li><a href="#">history</a></li>   <li><a href="#">contact us</a></li>   <li><a href="#">philosophy</a></li>   <li><a href="#">careers</a></li>         </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('news','','images/knoppenrollover_03.jpg',1)"><img src="images/knoppenbalk_03.jpg" name="news" width="166" height="41" border="0" id="news" /></a></li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('projects','','images/knoppenrollover_04.jpg',1)"><img src="images/knoppenbalk_04.jpg" name="projects" width="166" height="41" border="0" id="projects" /></a></li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Downloads','','images/knoppenrollover_05.jpg',1)"><img src="images/knoppenbalk_05.jpg" name="Downloads" width="165" height="41" border="0" id="Downloads" /></a>         <ul>           <li><a href="#">catalogs</a>            </li>           <li><a href="#">manuals</a></li>           <li><a href="#">software</a></li>           <li><a href="#">documents</a></li>           <li><a href="#">pricelists</a></li> </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','images/knoppenrollover_06.jpg',1)"><img src="images/knoppenbalk_06.jpg" name="Contact" width="169" height="41" border="0" id="Contact" /></a></li>     </ul></td>
sprymenuhorizontal.css:
@charset "UTF-8"; /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */ /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */ /*******************************************************************************   LAYOUT INFORMATION: describes box model, positioning, z-order   *******************************************************************************/ /* The outermost container of the Menu Bar, an auto width box with no margin or padding */ ul.MenuBarHorizontal {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 14px;      cursor: default;      width: 1010px;      font-family: Arial, Helvetica, sans-serif; } /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: [url]http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html[/url] */ ul.MenuBarActive {      z-index: 1000; } /* Menu item containers, position children relative to this container and are a fixed width */ ul.MenuBarHorizontal li {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 100%;      position: relative;      text-align: left;      cursor: pointer;      float: left; } /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ ul.MenuBarHorizontal ul {      list-style-type: none;      font-size: 100%;      z-index: 1020;      cursor: default;      width: 166px;      position: absolute;      left: -1000em;      background-color: #6C6C6C;      height: 0px;      margin-top: 0px;      margin-right: 0em;      margin-bottom: 10px;      margin-left: 0em;      text-align: right;      text-indent: 0em;      padding-top: 0px;      padding-right: 0em;      padding-bottom: 0px;      padding-left: 0px;      border-top-width: 1px;      border-right-width: 1px;      border-bottom-width: 1px;      border-left-width: 1px;      border-top-style: solid;      border-right-style: solid;      border-bottom-style: solid;      border-left-style: solid;      border-top-color: #666;      border-right-color: #666;      border-bottom-color: #666;      border-left-color: #666; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible {      left: auto;      height: 0px; } /* Menu item containers are same fixed width as parent */ ul.MenuBarHorizontal ul li {      width: 166px; } /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ ul.MenuBarHorizontal ul ul {      position: absolute;      height: 41px;      margin-top: 0%;      margin-right: 0%;      margin-bottom: 0px;      margin-left: 162px;      float: right; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible {      left: auto;      top: 0; } /*******************************************************************************   DESIGN INFORMATION: describes color scheme, borders, fonts   *******************************************************************************/ /* Submenu containers have borders on all sides */ ul.MenuBarHorizontal ul {      border: 1px solid #666;      background-color: #6C6C6C;      height: 0px;      padding-left: 0em; } /* Menu items are a light gray block with padding and no text decoration */ ul.MenuBarHorizontal a {      display: block;      cursor: pointer;      background-color: #6C6C6C;      padding: 0em;      color: #FC0;      text-decoration: none;      font-size: 14px;      margin-left: 0em; } /* Menu items that have mouse over or focus have a blue background and white text */ ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {      background-color: #FC0;      color: #FFF; } /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */ ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {      background-color: #FC0;      color: #FFF; } /*******************************************************************************   SUBMENU INDICATION: styles if there is a submenu under a given menu item   *******************************************************************************/ /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal a.MenuBarItemSubmenu {      background-image: url(SpryMenuBarDown.gif);      background-repeat: no-repeat;      background-position: 98% 50%; } /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal ul a.MenuBarItemSubmenu {      background-image: url(SpryMenuBarRight.gif);      background-repeat: no-repeat;      background-position: 98% 50%; } /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal a.MenuBarItemSubmenuHover {      background-image: url(SpryMenuBarDownHover.gif);      background-repeat: no-repeat;      background-position: 98% 50%; } /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover {      background-image: url(SpryMenuBarRightHover.gif);      background-repeat: no-repeat;      background-position: 98% 50%; } /*******************************************************************************   BROWSER HACKS: the hacks below should not be changed unless you are an expert   *******************************************************************************/ /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */ ul.MenuBarHorizontal iframe {      position: absolute;      z-index: 1010;      filter:alpha(opacity:0.1); } /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */ @media screen, projection {      ul.MenuBarHorizontal li.MenuBarItemIE      {           display: inline;           f\loat: left;           background: #FFF;      } }[/SPOILER] any help would be greatly appreciated, as i've been fidgiting with this thing for 2 days now, to no satisfying effect...

since the layout of the pasted text got all weird, here i'm trying it again.
sprymenubarhorizontal.css:
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
margin: 0;
padding: 0;
list-style-type: none;
font-size: 14px;
cursor: default;
width: 1010px;
font-family: Arial, Helvetica, sans-serif;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 166px;
position: absolute;
left: -1000em;
background-color: #6C6C6C;
height: 0px;
margin-top: 0px;
margin-right: 0em;
margin-bottom: 10px;
margin-left: 0em;
text-align: right;
text-indent: 0em;
padding-top: 0px;
padding-right: 0em;
padding-bottom: 0px;
padding-left: 0px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #666;
border-right-color: #666;
border-bottom-color: #666;
border-left-color: #666;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
height: 0px;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 166px;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
height: 41px;
margin-top: 0%;
margin-right: 0%;
margin-bottom: 0px;
margin-left: 162px;
float: right;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: 1px solid #666;
background-color: #6C6C6C;
height: 0px;
padding-left: 0em;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #6C6C6C;
padding: 0em;
color: #FC0;
text-decoration: none;
font-size: 14px;
margin-left: 0em;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
background-color: #FC0;
color: #FFF;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-color: #FC0;
color: #FFF;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 98% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 98% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 98% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 98% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

HT1338 how can i see the icon of mirroring options on menu bar?

i did check the mirroring options on menu bar in the system preferences - display but nothing happens, i don't see the icon in the menu bar HELP!!!!!!!
Does anybody knows why there's no icon of mirroring options or airplay on the menu bar ( i have a macbook pro and imac with mountain lion running )

Your Macs are probably too "old". Apple is pushing AirPlay and unless you have a newer (2011+) Mac, you'll never get the Displays menu bar icon back in its previous form. It is possible to get the icon to appear on your menu bar, however, your only option will be to "Open Display Preferences". You won't be able to detect displays, adjust brightness or change resolutions from the menu bar...
It *****.

Help with Spry Menu Bar Vertical

I have a page (html) with 3 frames (Top, Left, and Main). The
Left Frame will have the Spry Vertical Menu that will expand it's
submenus to the right, which I want it to overlap to the Main Frame
(which is to the right of the Left frame) .
Attempts:
1) I have increase the Z-Index of the Menu to a greater value
than anything on all frames, but this didn't working.
Please help!
Respectfully,
-Victor

quote:
Originally posted by:
Enchauva
I have a page (html) with 3 frames (Top, Left, and Main). The
Left Frame will have the Spry Vertical Menu that will expand it's
submenus to the right, which I want it to overlap to the Main Frame
(which is to the right of the Left frame) .
Attempts:
1) I have increase the Z-Index of the Menu to a greater value
than anything on all frames, but this didn't working.
Please help!
Respectfully,
-Victor
I too have a similar problem if not exactly the same. I am
finding it difficult getting information about it because I don't
really know how to describe what is happening!
In essence when I have a menu bar as you describe on the left
and another placeholder AP div to teh right of that menus when I
preview in a browser the whole things collapses and is very very
sensitive when you try to navigate to the right and drop out menu
Mine are vertical (popping out to the left!)
Now if I remove the place holder all is fine BUT I need to
use the place holder to position a collapsible panel.
At one stage I thought it was the collapsable panel causing
issues but an empty AP DIV tag all cause the issue!

Address bar and menu bar hidden unless I expand page and use the pointer

I am a new user of imac. Can you please help me - the menu bar and address bar and search bar does not show when I open Safari. I can get it if I expand the page and use the pointer to point at the top of the screen. This is the only way I can use it now. I hope you can help I am not too savvy yet on this lovely machine.

If you are using Lion OSX, they have implemented a full page feature for many programs. If you are running it full screen (like it sounds like you are) then you just move your mouse up to the top of the page for those items to appear. If you don't like full page, there is a button in the top right corner (it has 2 arrows pointing at each other) and you can click that and bring it back to the normal mode.
Hope that helps.

Vertical spry menu bar not expanding

Hi,
So here is the website I am working on. The menu bar is not expanding. It only needs to expand for the "Basic Concepts" tab.
http://mypage.iu.edu/~mgmodell/r547/reuse/
I know why I am having the problem because I tried a lot of the sprys out and when I deleted them not everything was cleared. But any help would be nice!

It looks like it is fixed
Gramps

I have a new MacBook(2012). Being a new Mac user, I do not know what to do when Safari doesn't open at all. The icon just bounces up and down and when the cursor is on the top main menu bar it is the spinning rainbow wheel. Any ideas for help?

When I try to open safari the icon stats bouncing and then nothing happens other than the cursor turning to a spinning rainbow wheel when it hoovers on the top main menu bar. I have shut down and restart several times. My safari worked yesterday and then today this, but with. I indication of a problem. I can't even get the browser window to open so that I can clear caches or reset anything. When I opened my computer this time I don't even get a bouncing icon. No recognition of selecting the program at all. If I go to spotlight and try to open safari from here I still get no response. Can you help?

Hi ...
If you have moved the Safari application from the Applications folder, move it back.
As far as the cache goes, there's a work around for that when you can't empty the Safari cache from the menu bar.
Go to ~/Library/Caches/com.aple.Safari.Cache.db. Move the Cache.db file to the Trash.
Try Safari.
Mac OS X (10.7.2) < from your profile
If that is corrrect, you need to update your system software. Click your Apple menu icon top left in your screen. From the drop down menu click Software
Update ...
~ (Tilde) character represents the Home folder.
For Lion v10.7x: To find the Home folder in OS X Lion, open the Finder, hold the Option key, and choose Go > Library

BIG problems with iOS 8.2 Safari ("dark mode" menu bar, no auto-fill, etc)... HELP, please?

So I was simply wiping the dust off my screen, with Safari open, and once I had finished... Safari just went belly-up.
And I need some help badly.
First thing that I noticed was that Safari now has a "dark mode" menu bar.
Secondly, my auto-fill user names and passwords no longer "auto-fill" - I have to place the cursor in a field and have the keyboard pop up in order to access the auto-fill function: previously, the fields simply, well, auto-filled.
And, thirdly, when I attempt to post a message to the Apple Support Communities, there is no visible text in the body of the text. I'm using my MacBook Pro to type this message.
I have searched and searched to try to find remedies to my problems, but I can't find a thing. There's nothing unusual in Accessibility (that would make the whole screen, for example, grayscale), nothing changed in passwords, etc.
I'm at my wits end! Even restoring from an older backup doesn't remedy any of the problems.
Can anyone help?
Clinton
iPad Air 2, WiFi only

If the menu bar at the top of Safari show white text on a grey background, and autofill isn't working, then you probably have private browsing 'on'. Tap the icon top right of the Safari screen (the square on top of a second square), tap the Private button at the top of the next screen and then Done - Safari should then go back to its normal colours and autofill should work again

Spry Menu Bar issue, NEED HELP...???

Here is the coding for a menu bar that i created with CS3, for some reason i am having an issue when i open the web page in IE, on firefox and safari it looks fine, the menu drops down to sub menu's fine, but for some reason when i open it in IE, the submenu's show on the very top of the page rather than right below the menu itself, please check my coding and see if there is an issue???
i ran compatability and there are no issues shown.
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - Revision: Spry Preview Release 1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 10.4em;
    float: left;
    background-image: url(tab2.png);
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 8.2em;
    position: absolute;
    left: -1000em;
    text-decoration: underline;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
    background-image: url(../tab1.png);
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    width: 8.2em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: default;
    padding: 0.5em 0.75em;
    color: #FFFFFF;
    text-decoration: none;
    border-left-color: #0063bd;
    border-right-color: #0063bd;
    border-right-width: 3px;
    border-left-width: thin;
    font-family: Calibri;
    font-weight: bold;
    font-size: 19px;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #000000;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    color: #000000;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarDownHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline-block;
    f\loat: left;
    position: relative;

Hey gramps, thanks for the info, i have updated my spry framework to 1.6.1 but the problem is still the same, i recreated my menu with the new 1.6 and it still doing the same thing, the submenu's are like vertically reversed... ugh need help.
here the new code
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 10.4em;
    float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 8.2em;
    position: absolute;
    left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
    background-image: url(../tab1.png);
    line-height: 18px;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    width: 8.2em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
    border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 19px;
    font-family: Calibri;
    font-weight: bolder;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #000000;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    color: #000000;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: left;

Expanding menu bar help

Similar Messages

Maybe you are looking for