Nav/Menu bar hidden behind images

I placed my nav/menu widget in my master page. I have several layers in each page that I would like to arranged behind the nev/menu bar so I can still utilize it. Muse doesn't seem to let me push the images back behind the nav bar. Currently my photos are covering the nav bar so it can't be utilized. Help! Thank you.

With the release of Muse 4.0 today, Master page elements can now layer in front of content on those pages to which the Master has been applied. To re-order Master page content select elements on the Master page, right-click and select "Move to Master Foreground" or "Move to Master Background" from the popup menu. Alternatively select elements on the Master page, then select Object > Move to Background or Foreground in the Muse application menu. All elements in the Master page set to "Move to Master Foreground" will appear on top of all elements in the Page.
Please refer to Muse release notes for more information on this.
http://helpx.adobe.com/content/help/en/muse/release-note/adobe-muse-re lease-notes.html
Thanks,
Vinayak

Similar Messages

Spry menu bar hidden behind embedded windows media player in IE but Not Firefox

Hi ppl.. My spry menu bar submenus are hidden below my embedded windows media player when I go over the menu. Is there anything I can do to solve this. This doesn't happen in Firefox.(The submenu appear on top of the embedded player) Pls help.. Thank you!
Here's my spry menu bar css 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: 9em;
    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: 9em;
    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;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    width: 9em;
    border-bottom-width: thin;
    border-bottom-style: solid;
    border-bottom-color: #CCC;
/* 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
    background-color: #333;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    color: #FFF;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding-top: 1.1em;
    padding-right: 0.75em;
    padding-bottom: 1.1em;
    padding-left: 0.75em;
    text-align: center;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #000;
    background-image: url(../images/navimg2.gif);
/* 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: #000;
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(../images/navimg2.gif);
    background-repeat: repeat-x;
    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;
    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;
Here's my embedded windows media player code.
<OBJECT ID="MediaPlayer" WIDTH="425" HEIGHT="344" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject">
          <PARAM NAME="FileName" VALUE="aqeedah1v7.wmv">
          <PARAM name="autostart" VALUE="true">
          <PARAM name="ShowControls" VALUE="true">
          <param name="ShowStatusBar" value="true">
          <PARAM name="ShowDisplay" VALUE="false">
          <EMBED TYPE="application/x-mplayer2" SRC="aqeedah1v7.wmv" NAME="MediaPlayer"
WIDTH="425" HEIGHT="344" ShowControls="1" ShowStatusBar="1" ShowDisplay="0" autostart="1"> </EMBED>
</OBJECT>

Add
<param name="WindowlessVideo" value="-1">

Spry Menu Bar hides behind embedded windows media player

Hi guys. My Spry Menu Bar hides behind my embedded windows media player when I go over the menu with my mouse. Below is the code I used to embed my player. How can I make it transparent? Thank you!

To the Params in your object tag, add this:
To the attributes in your embed tag, add this:
wmode="opaque"
Note that z-index is totally irrelevant to Flash. also note that the Adobe Flash Player is wildly inconsistent from browser to
browser and from OS to OS, which is one of the more valid reasons for Apple abandoning the technology's support on its touch
devices.
Al Sparber - PVII
http://www.projectseven.com
Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/hgm
The Ultimate Web 2.0 Carousel

Title Bar hidden behind Apple Mac menu bar

Hi
I am using Elements Organizer 12.1 and, for some reason, the title bar is hidden behind my Apple Mac menu bar. Does anyone know how to click behind the menu bar so I can access the Elements title bar?
Thanks
Richard

The first thing to try is to go to system preferences>displays and set your screen resolution down as far as it will go. You may need to try a few different settings, but eventually it may snap back into place and then you can go back to the correct setting for your display.

Spry Horizontal submenu hidden behind image

This is driving me nuts. I am using Dreamweaver CS4. I have created a horizontal menu bar just above an image. When i hover over the main menu item the submenu is hidden behind the image. I have not been able to figure this one outy. i am very new to CSS and Dreamweaver. This is a template that i want to use across my entire site. You can goto http://www.gray-wolf.net/MainPages.html.
@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: auto;
width: 800px;
font-family: Arial, Helvetica, sans-serif;
background-color: #008080;
height: 40px;
float: left;
top: 100px
/* 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: 8em;
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;
/* 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;
background-color: #EEE;
padding: 0.5em 0.75em;
color: #333;
text-decoration: none;
/* 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: #33C;
color: #FFF;
width: auto;
/* 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: #33C;
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: 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;
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;
float: left;
background: #FFF;

Your unexpected (and undesired) wolf call on entering that page scared the begesus outta me. Most people don't take kindly to such surprises!
You do realize that the page you linked to is a TEMPLATE page, but it is named with an HTML extension, right? You did that just to show us the template?
Also, it appears that you have built your entire site inside of the Templates folder -
<a href="Templates/pgpage1.htm" title="Page 1 of my Photo Gallery">
That's improper. Nothing should be in the Templates folder other than the template files themselves.
Finally, your use of absolute positioning as a primary page layout method is going to get you into serious trouble. Please read this -
http://apptools.com/examples/pagelayout101.php
Now - here's the problem:
You have applied a style of 'overflow:hidden' to div#nav. Remove that. With that in place, the submenus cannot flow OUT of div#nav.

Menu dropping down behind image.

http://72.29.76.51/~organica/index.html
If you scroll over the GROCERY tab, you'll see that the pull down is hidden behind the image below. Any hints on getting the menu to appear in front of the image? Here's the code:
<!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>Organica Natural Foods | Northvale, New Jersey</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="fadeslideshow.js">
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
</script>
<script type="text/javascript">
var mygallery=new fadeSlideShow({
    wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
    dimensions: [600, 493], //width/height of gallery in pixels. Should reflect dimensions of largest image
    imagearray: [
        ["media/slide_2.jpg", "", "", ""],
        ["media/slide_1.jpg", "", "", ""],
         //<--no trailing comma after very last image element!
    displaymode: {type:'auto', pause:6000, cycles:1, wraparound:false},
    persist: false, //remember last viewed slide and recall within same session?
    fadeduration: 2000, //transition duration (milliseconds)
    descreveal: "ondemand",
    togglerid: ""
</script>

<link href="main.css" rel="stylesheet" type="text/css" />
<link href="Spry-UI-1.7/css/Menu/basic/SpryMenuBasic.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://s3slider-original.googlecode.com/svn/trunk/s3Slider.js"></script>
<script src="Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
<script src="Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
<script src="Spry-UI-1.7/includes/SpryWidget.js" type="text/javascript"></script>
<script src="Spry-UI-1.7/includes/SpryMenu.js" type="text/javascript"></script>
<script src="Spry-UI-1.7/includes/plugins/MenuBar2/SpryMenuBarKeyNavigationPlugin.js" type="text/javascript"></script>
<script src="Spry-UI-1.7/includes/plugins/MenuBar2/SpryMenuBarIEWorkaroundsPlugin.js" type="text/javascript"></script>
<style type="text/css">
/* BeginOAWidget_Instance_2141544: #MenuBar */
/* Settable values for skinning a Basic menu via presets. If presets are not sufficient, most skinning should be done in
    these rules, with the exception of the images used for down or right pointing arrows, which are in the file SpryMenuBasic.css
     These assume the following widget classes for menu layout (set in a preset)
    .MenuBar - Applies to all menubars - default is horizontal bar, all submenus are vertical - 2nd level subs and beyond are pull-right.
    .MenuBarVertical - vertical main bar; all submenus are pull-right.
    You can also pass in extra classnames to set your desired top level menu bar layout. Normally, these are set by using a preset.
    They only apply to horizontal menu bars:
        MenuBarLeftShrink - The menu bar will be horizontally 'shrinkwrapped' to be just large enough to hold its items, and left aligned
        MenuBarRightShrink - Just like MenuBarLeftShrink, but right aligned
        MenuBarFixedLeft - Fixed at a specified width set in the rule '.MenuBarFixedLeft', and left aligned.
        MenuBarFixedCentered - - Fixed at a specified width set in the rule '.MenuBarFixedCentered',
                        and centered in its parent container.
        MenuBarFullwidth - Grows to fill its parent container width.
    In general, all rules specified in this file are prefixed by #MenuBar so they only apply to instances of the widget inserted along
    with the rules. This permits use of multiple MenuBarBasic widgets on the same page with different layouts. Because of IE6 limitations,
    there are a few rules where this was not possible. Those rules are so noted in comments.
#MenuBar {
    background-color:#003300;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; /* Specify fonts on on MenuBar and subMenu MenuItemContainer, so MenuItemContainer,
                                                MenuItem, and MenuItemLabel
                                                at a given level all use same definition for ems.
                                                Note that this means the size is also inherited to child submenus,
                                                so use caution in using relative sizes other than
                                                100% on submenu fonts. */
    font-weight: bold;
    font-size: 12px;
    font-style: normal;
    padding:0;
/* Caution: because ID+class selectors do not work properly in IE6, but we want to restrict these rules to just this
widget instance, we have used string-concatenated classnames for our selectors for the layout type of the menubar
in this section. These have very low specificity, so be careful not to accidentally override them. */
.MenuBar br { /* using just a class so it has same specificity as the ".MenuBarFixedCentered br" rule bleow */
    display:none;
.MenuBarLeftShrink {
    float: left; /* shrink to content, as well as float the MenuBar */
    width: auto;
.MenuBarRightShrink {
    float: right; /* shrink to content, as well as float the MenuBar */
    width: auto;
.MenuBarFixedLeft {
    float: left;
    width: 100%;
.MenuBarFixedCentered {
    float: none;
    width: 100%;
    margin-left:auto;
    margin-right:auto;
.MenuBarFixedCentered br {
    clear:both;
    display:block;
.MenuBarFixedCentered .SubMenu br {
    display:none;
.MenuBarFullwidth {
    float: left;
    width: 100%;
/* Top level menubar items - these actually apply to all items, and get overridden for 1st or successive level submenus */
#MenuBar .MenuItemContainer {
    padding: 0px 0px 0px 0px;
    margin: 0;
     /* Zero out margin on the item containers. The MenuItem is the active hover area.
                For most items, we have to do top or bottom padding or borders only on the MenuItem
                or a child so we keep the entire submenu tiled with items.
                Setting this to 0 avoids "dead spots" for hovering. */
#MenuBar .MenuItem {
    padding: 0px 8px 0px 8px;
    background-color:transparent;
    border-right: 1px solid #FFF;
    border-left: 1px solid #FFF;
#MenuBar .MenuItemFirst {
    border-style: none none none none;
#MenuBar .MenuItemLast {
    border-style: none solid none none;
#MenuBar .MenuItem .MenuItemLabel{
    text-align:left;
    line-height:1.4em;
    color:#ffffff;
    background-color:transparent;
    padding: 6px 15px 6px 15px;
    width: 10em;
    width:auto;
.SpryIsIE6 #MenuBar .MenuItem .MenuItemLabel{
    width:1em; /* Equivalent to min-width in modern browsers */
/* First level submenu items */
#MenuBar .SubMenu .MenuItem {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    font-style: normal;
    background-color:transparent;
    padding:0px 8px 0px 0px;
    border-width:1px;
    border-color: #cccccc #cccccc #cccccc #cccccc;
    /* Border styles are overriden by first and last items */
    border-style: solid solid none solid;
#MenuBar .SubMenu .MenuItemFirst {
    border-style: solid solid none solid;
#MenuBar .SubMenu .MenuItemFirst .MenuItemLabel{
    padding-top: 6px;
#MenuBar .SubMenu .MenuItemLast {
    border-style: solid solid solid solid;
#MenuBar .SubMenu .MenuItemLast .MenuItemLabel{
    padding-bottom: 6px;
#MenuBar .SubMenu .MenuItem .MenuItemLabel{
    text-align:left;
    line-height:1em;
    background-color:transparent;
    color:#ffffff;
    padding: 6px 12px 6px 5px;
    width: 7em;
/* Hover states for containers, items and labels */
#MenuBar .MenuItemHover {
    background-color: transparent;
    border-color: #cccccc #cccccc #cccccc #cccccc;
#MenuBar .MenuItemWithSubMenu.MenuItemHover .MenuItemLabel{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #999999;
#MenuBar .MenuItemHover .MenuItemLabel{
    background-color: transparent;
    color: #999999;
#MenuBar .SubMenu .MenuItemHover {
    background-color: #003300;
    border-color: #cccccc #cccccc #cccccc #cccccc;
#MenuBar .SubMenu .MenuItemHover .MenuItemLabel{
    background-color: transparent;
    color: #999999;
/* Submenu properties -- First level of submenus */
#MenuBar .SubMenuVisible {
    background-color: #003300;
    min-width:0%; /* This keeps the menu from being skinnier than the parent MenuItemContainer - nice to have but not available on ie6 */
    border-color: #ffffff #ffffff #ffffff #ffffff;
    border-width:0px;
    border-style: none none none none;
#MenuBar.MenuBar .SubMenuVisible {/* For Horizontal menubar only */
    top: 100%;    /* 100% is at the bottom of parent menuItemContainer */
    left:0px; /* 'left' may need tuning depending upon borders or padding applied to menubar MenuItemContainer or MenuItem,
                    and your personal taste.
                    0px will left align the dropdown with the content area of the MenuItemContainer. Assuming you keep the margins 0
                    on MenuItemContainer and MenuItem on the parent
                    menubar, making this equal the sum of the MenuItemContainer & MenuItem padding-left will align
                    the dropdown with the left of the menu item label.*/
    z-index:10;
#MenuBar.MenuBarVertical .SubMenuVisible {
    top: 0px;
    left:100%;
    min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse */
/* Submenu properties -- Second level submenu and beyond - these are visible descendents of .MenuLevel1 */
#MenuBar .MenuLevel1 .SubMenuVisible {
    background-color: #003300;
    min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse*/
    top: 0px;    /* If desired, you can move this down a smidge to separate top item''s submenu from menubar -
                that is really only needed for submenu on first item of MenuLevel1, or you can make it negative to make submenu more
                vertically 'centered' on its invoking item */
    left:100%; /* If you want to shift the submenu left to partially cover its invoking item, you can add a margin-left with a
                negative value to this rule. Alternatively, if you use fixed-width items, you can change this left value
                to use px or ems to get the offset you want. */
/* IE6 rules - you can delete these if you do not want to support IE6 */
/* A note about multiple classes in IE6.
* Some of the rules above use multiple class names on an element for selection, such as "hover" (MenuItemHover) and "has a subMenu" (MenuItemWithSubMenu),
* giving the selector '.MenuItemWithSubMenu.MenuItemHover'.
* Unfortunately IE6 does not support using mutiple classnames in a selector for an element. For a selector such as '.foo.bar.baz', IE6 ignores
* all but the final classname (here, '.baz'), and sets the specificity accordingly, counting just one of those classs as significant. To get around this
* problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate compound classnames for IE6, such as 'MenuItemWithSubMenuHover'.
* Since there are a lot of these needed, the plugin does not generate the extra classes for modern browsers, and we use the CSS2 style mutltiple class
* syntax for that. Since IE6 both applies rules where
* it should not, and gets the specificity wrong too, we have to order rules carefully, so the rule misapplied in IE6 can be overridden.
* So, we put the multiple class rule first. IE6 will mistakenly apply this rule. We follow this with the single-class rule that it would
* mistakenly override, making sure the misinterpreted IE6 specificity is the same as the single-class selector, so the latter wins.
* We then create a copy of the multiple class rule, adding a '.SpryIsIE6' class as context, and making sure the specificity for
* the selector is high enough to beat the single-class rule in the "both classes match" case. We place the IE6 rule at the end of the
* css style block to make it easy to delete if you want to drop IE6 support.
* If you decide you do not need IE6 support, you can get rid of these, as well as the inclusion of the SpryMenuBarIEWorkaroundsPlugin.js script.
* The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser is Internet Explorer 6. This avoids the necessity of IE conditional comments for these rules.
.SpryIsIE6 #MenuBar .MenuBarView .MenuItemWithSubMenuHover .MenuItemLabel /* IE6 selector */{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #999999;
.SpryIsIE6 #MenuBar .MenuBarView .SubMenu .MenuItemWithSubMenuHover .MenuItemLabel/* IE6 selector */{
    background-color: transparent; /* consider exposing this prop separately*/
    color: #999999;
.SpryIsIE6 #MenuBar .SubMenu .SubMenu /* IE6 selector */{
    margin-left: -0px; /* Compensates for at least part of an IE6 "double padding" version of the "double margin" bug */
/* EndOAWidget_Instance_2141544 */
</style>
<script type="text/xml">

</script>


</head>
<body bgcolor="#17321A">
<div id="outerWrapper">
<div id="header"><img src="media/header.jpg" width="960" height="160" alt="organica title" /></div>
<div id="navbar">
    <ul id="MenuBar">
      <li> <a href="index.html">Home</a></li>
      <li> <a href="kitchen.html">Kitchen</a>
      <ul>
          <li> <a href="menus.html">Menus</a></li>
          <li> <a href="catering.html">Catering</a></li>
      </ul>
      </li>
      <li> <a href="juicebar.html">Juice Bar</a></li>
      <li> <a href="produce.html">Produce</a></li>
      <li> <a href="supplements.html">Supplements</a></li>
      <li> <a href="grocery.html">Grocery</a>
      <ul>
          <li> <a href="packaged.html">Packaged Goods</a></li>
          <li> <a href="refrigerated.html">Refrigerated</a></li>
          <li> <a href="frozen.html">Frozen Foods</a></li>
          <li> <a href="glutenfree.html">Gluten Free</a></li>
      </ul>
      </li>
      <li> <a href="bodycare.html">Body Care</a></li>
      <li> <a href="events.html">Events</a></li>
      <li> <a href="contact.html">Contact</a>
      <ul>
          <li> <a href="directions.html">Directions</a></li>
          <li> <a href="employment.html">Employment</a></li>
      </ul>
      </li>
      </ul>
    <script type="text/javascript">
// BeginOAWidget_Instance_2141544: #MenuBar
var MenuBar = new Spry.Widget.MenuBar2("#MenuBar", {
      widgetID: "MenuBar",
      widgetClass: "MenuBar MenuBarFullwidth",
      insertMenuBarBreak: true,
      mainMenuShowDelay: 100,
      mainMenuHideDelay: 200,
      subMenuShowDelay: 200,
      subMenuHideDelay: 200
// EndOAWidget_Instance_2141544
    </script>
</div>
<div id="contentWrapper">
    <div id="sidebar">
      <h2>Get Your Organica Loyalty Card<br />
        <img src="media/loyalty.jpg" width="200" height="129" alt="loyalty" /></h2>
      <hr width="90%" size="1" />
      <p>
        <style>
.link,
.link a,
.signupframe
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    .link,
    .link a {
        text-decoration: none;
    .signupframe {
        border: 0px solid #000000;
        background: #ffffff;
.signupframe .required {
    font-size: 10px;
    </style>
      </p>
      <form method="post" action="https://app.icontact.com/icp/signup.php" name="icpsignup" id="icpsignup8190" accept-charset="UTF-8" onsubmit="return verifyRequired8190();" >
        <input type="hidden" name="redirect" value="http://organicanaturalfoods.com/thanks.html" />
        <input type="hidden" name="errorredirect" value="http://www.icontact.com/www/signup/error.html" />
        <div id="SignUp">
          <h2>Sign-up for our Organica e-News<br />
            Receive coupons, event info, and more! </h2>
          <table width="200" align="center" class="signupframe" border="0" cellspacing="0" cellpadding="5">
            <tr>
              <td align="center"><input type="text" name="fields_email" /></td>
            </tr>
            <input type="hidden" name="listid" value="70490" />
            <input type="hidden" name="specialid:70490" value="HHBU" />
            <input type="hidden" name="clientid" value="971128" />
            <input type="hidden" name="formid" value="8190" />
            <input type="hidden" name="reallistid" value="1" />
            <input type="hidden" name="doubleopt" value="0" />
            <tr>
              <td><div align="center">
                <input type="submit" name="Submit" value="Submit" />
              </div></td>
            </tr>
          </table>
        </div>
      </form>
      <script type="text/javascript">
var icpForm8190 = document.getElementById('icpsignup8190');
if (document.location.protocol === "https:")
    icpForm8190.action = "https://app.icontact.com/icp/signup.php";
function verifyRequired8190() {
if (icpForm8190["fields_email"].value == "") {
    icpForm8190["fields_email"].focus();
    alert("The Email field is required.");
    return false;
return true;
    </script>
      <p></p>
      <p>
<iframe src=
"http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FOrganicaN aturalFood&width=250&colorscheme=light&show_faces=true&border_color&stream=false&header=fa lse&height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
      </p>
    </div>

    <div id="content"><div id="slide"><div id="fadeshow1"></div></div>
    </div>
    
    <div id="footer">
      <a href="index.html">Home</a> | <a href="about.html">About Us</a> | <a href="links.html">Links</a> | <a href="directions.html">Directions</a> | <a href="employment.html">Employment</a> | <a href="contact.html">Contact Us</a><br />
    All contents ©2011 Organica Natural Foods | Site Design: <a href="http://nowagenewmedia.com" target="_blank">Now Age New Media</a><br />
    *Statements on this site relating to any dietary supplements have not been evaluated by the Food and Drug Administration. <br />
    These products are not intended to diagnose, treat, cure or prevent any disease. If you are pregnant, nursing, taking medication, <br />
    or have a medical condition, consult your physician before using these products. </div>
</div>
</div>
</body>
</html>

IE doesn't like something about
http://72.29.76.51/~organica/fadeslideshow.js
Perhaps try re-uploading it.

Adobe Reader 10.0.1 hides menu bar when display image is enlarged

I am running an HP Pavilion Elite HPE 400y connected via HDMI through a Sony Receiver into a SamSung XL-2370 LED Monitor. On the HP I'm running Windows 7 Home Premium 64-bit. When I go to Control Panel / All Control Panel Items / Display and set the screen display size to Medium (125%), Adobe Reader 10.0.1 moves the top of the document being displayed upward to hide most of the menu bar. Also, the tools bar is usually unstable. I can't use any of the menu because mouse clicks in the narrow portion of the menu bar that is exposed are ignored. To shut down Adobe Reader I must start the Windows Task Manager with CTRL-ALT-DELETE and then knock it down because the X on the upper right of the menu bar is hidden. When I set the screen display size to Smaller (100%), which is the usual setting, everything works fine. I like using the larger image size (older eyes), but I can live with the normal size. Unfortunately, to change the Windows image size you must log off your session, so it's not something I like to do more often than necessary.
This appears to be a problem with Adobe Reader 10.0.1 not adjusting properly with the larger image size. God knows what it would do if I used the Larger (150%) setting. Maybe there aren't any old people at Adobe who need a larger image. Otherwise, I'm sure it would have been noticed by now.

As far as I know, Adobe Reader (even v7.0.8) isn't Universal yet, which means it [the plugin] probably won't run natively on your Intel iMac unless you run Safari under Rosetta.
Yang

Importing A Combo Banner/Menu Bar And Background Image

Hi,
In one Photoshop file, I've created a banner/menu bar, as well as what I would like to use as the background image for what appears on the remainder of the page. The menu items are not in a box of any sort. And everything is on a separate layer. The image that appears below is one I made up as an example of what I'm talking about. Can I import it into Dreamweaver as one file? Or should I make one file for the banner/menu bar, and one for the rest of the page?
Thank you.

Hi,
I believe it is best to import everything individually in most/all circumstances. When you are talking about banner images or background images think about the size of the file you are exporting from Photoshop. A 'Save for Web' image will be a lot bigger if it includes everything on the page, compared to the individual size of your banner, and therefore will increase the page load times etc.
So, you can create a photoshop file with your whole layout on there, but then crop each of the elements on its own before saving for web. Even each individual menu item.

Pop-Up Menu getting hidden behind Layers - HELP!

I'm designing with layers instead of tables for the first
time. I've just begun inserting vertical Pop-Up Menus as usual as
part of my navigation buttons and when I checked it in the browser,
I saw that the menu is getting hidden behind the separate layer
below the layer that I have my navigation buttons in.
Can anyone tell me how to fix this? Is there a way to set the
properties to make one layer more prominent than other layers or
something along those lines? Why would it be doing this in the
first place?
Thanks in advance!!

You are on the wrong road here. Check this -
http://apptools.com/examples/pagelayout101.php
Here's why you don't want to use layers as a general layout
tool -
http://www.great-web-sights.com/g_layer-overlap.asp
And here's why you don't want to use DW's pop-up menus -
http://www.losingfight.com/blog/2006/08/11/the-sordid-tale-of-mm_menufw_menujs/
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"breathingunderwater" <[email protected]>
wrote in message
news:f54tl1$qgo$[email protected]..
> I'm designing with layers instead of tables for the
first time. I've just
> begun
> inserting vertical Pop-Up Menus as usual as part of my
navigation buttons
> and
> when I checked it in the browser, I saw that the menu is
getting hidden
> behind
> the separate layer below the layer that I have my
navigation buttons in.
>
> Can anyone tell me how to fix this? Is there a way to
set the properties
> to
> make one layer more prominent than other layers or
something along those
> lines?
> Why would it be doing this in the first place?
>
> Thanks in advance!!
>

Top nav / menu bar extremely slow -- have to use bottom nav. How can I fix this?

Top menu bar is extremely slow -- need to use the bottom nav first. I thought once it was live with own domain name (BC is host, built with Muse) it would speed things up. No luck. The site < http://www.onlyrealgamemovie.com > is relatively small and has always had this issue. I need to correct this problem ASAP because the film is in "Festival Mode" and starting premiers. Any suggestions on how to fix this? Thanks in advance, Jill

Thank you so very much -- that makes complete sense! The animation is
only on that opening page.
I need to keep the animation -- I am guessing I should recreate the
Flash so it does not cover the menu?
Or would a faster short-cut work by hyper-linking the menu tabs just on
that page?
I cannot tell you how helpful this is and how much I appreciate your
response!
Jill

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.

Right side of menu bar hidden after 2nd monitor disconnect

Hello, When I disconnect my 30" external monitor from my MacBook Pro, the far right side of my menu bar disappears -- the part with the clock and battery information, bluetooth menu and various other little doodads. How do I get the menu back?
Also, is there anyway to keep this from happening?
When the monitor is attached, I have it set up so the menu bar goes on the monitor, as well as the Dock.
The Dock resizes perfectly when I disconnect the external monitor. It's just the menu bar that's screwy.
I'm running an up-to-date version of OS X 10.5.2.

This is how Apple's marketing materials describe the process of hooking up an external monitor to a MacBook Pro:
"Connect an Apple Cinema Display to expand your desktop and lose nothing in translation."
--http://www.apple.com/macbookpro/features.html
This is false advertising. You lose your clock, WiFi menu, Time Machine menu, Spotlight and more in the translation.
This is a very real bug.

Photoshop Elements Menu Bar hidden

I notice with Photoshop Elements that on some installs the full menu of 'File', 'Edit', 'Find', 'View', 'Window' and 'Help' appears at the top of the screen, yet on other installs only a Chevron '>>' appears that you have to click onto to reveal the menu options. How do I set up the program so that the full list of options appears in the Menu Bar at the top of the screen?
best regards,
James

http://www.johnrellis.com/psedbtool/photoshop-elements-faq.htm#_Setting_the_Wind ows

Spry Menu Bar - Different Background Image Wanted for menu items

Hi, I've looked everywhere for help with this and just haven't found any answers yet ...
I want my Dreamweaver CS5.5 menu to look like this design I've done in PhotoShop ...
It's a simple one level list with no sub-levels.
Everything is good, except I can only set one background image for all the menu items at this level.
I want the first, last, and all the middle, menu items to use different background images.
I have no idea where or how to insert the code to set a different background image for each individual menu item ...
I know I could use images set one on top another in a column with rollover image swop, but the spry menu opens the door for dynamic content so I'm keen to get it working.
Manchester city council has a great example of this style of menu design working at - http://www.manchester.gov.uk/
They've got funky indenting of the text as well.
~~~~~~
This is the code for my menu list ...
<div class="sidebar1">
    <ul id="MenuBar1" class="MenuBarVertical">
      <li><a href="#">Home</a></li>
      <li><a href="#">News</a></li>
      <li><a href="#">Groups</a></li>
      <li><a href="#">Events</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
         <li><a href="#">Help</a></li>
    </ul>
</div>
This is how I set the background image (but I can only define one image) ...
I set the image background to "Menu-Nav-Bar-Pic-Top-v1-w170px-h32px.jpg" through ...
CSS Styles
SpryMenuBarVertical.css
ul.MenuBarVertical a
I then select the background category
and browse to the image file.
doing this changes my CSS code as follows ...
ul.MenuBarVertical li
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 170px;
    margin-top: 4px;
    margin-bottom: 4px;
    background: url(/Images/Menu-Nav-Bar-Pic-Top-v1-w170px-h32px.jpg);
ul.MenuBarVertical ul
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 170px;
    left: -1000em;
    top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 95%;
    background: url(/Images/Menu-Nav-Bar-Pic-Top-v1-w170px-h32px.jpg);
ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #0000;
    text-decoration: none;
    font: normal 12px Verdana, Geneva, sans-serif;
    background: #EEE url(/Images/Menu-Nav-Bar-Pic-Top-v1-w170px-h32px.jpg);
~~~~~~
These are the three images I want to apply to the top middle and bottom menu items :
Top menu item background image - "Menu-Nav-Bar-Pic-Top-v1-w170px-h32px.jpg"
Middle menu items background image - "Menu-Nav-Bar-Pic-Mid-v1-w170px-h32px.jpg"
Bottom menu item background image - "Menu-Nav-Bar-Pic-Bot-v1-w170px-h32px.jpg"
~~~~~~
As I am unable to set the menu items individually, this is how the menu looks like on my website at the moment ...
~~~~~~
So near yet so far ! I'm hapy with the verdana font, the image size and spacing, but the background images I just can't set them right.
I'd really appreciate any help on this as I'm out of ideas.
Thank you.

The easiest way is to use pseudo elements.
To style the first and last menu items ifferently to the rest, merely add :first-child and :last-child respectivly as follows
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css">
<style>
ul.MenuBarVertical li:first-child a {
    background-color: red;
    color: white;
ul.MenuBarVertical li:last-child a {
    background-color: green;
    color: yellow;
</style>
</head>
<body>
<ul id="MenuBar1" class="MenuBarVertical">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
</ul>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
In your case, in liue of the background colour, you would have an image.
Gramps

Extra White Space from Hidden Menu Bar

This seems to be a problem introduced by LV 2013. I have a VI that runs with the menu bar hidden. When I hit ctrl-m to see how it looks in run mode, it looks fine. When I run the VI, instead of fully hiding the menu bar, it leaves white space. This only seems to be a problem when the VI is the top level. When the VI is opened from another VI, it looks fine. I've attached screenshots when the VI is running as a top level, ctrl-m is used and running when launched from another VI. This was not an issue in LV 2012. It's only been a problem since switching to 2013.
Solved!
Go to Solution.
Attachments:
Settings Screen Running Dev.png ‏86 KB
Settings Screen CTRL-m.png ‏84 KB
Setting Screen - Launch as SubVI.PNG ‏107 KB

Greetings thutch79,
I replicated the settings shown at Window Appearance Dialog.png on a new VI, ran it, and did not reproduce the problem.
I wonder if you experience the same behavior with a new VI? If not, you can copy paste the code to a new VI to fix a potential corruption issue.
Regards,
Alejandro | Academic Program Engineer | National Instruments
Attachments:
Window Appearance.JPG ‏119 KB
Running VI.JPG ‏21 KB

Nav/Menu bar hidden behind images

Similar Messages

Maybe you are looking for