Dropdown Menu Not Covering Side Navigation Menu

Hello,
I have a page with a top navigation bar that includes dropdowns and a side navigation bar. The problem I am having is that the dropdowns are not covering over the sidebar menu, but seem to be blending with it on the same level.
If you look at my page:
http://mymajesticwindow.com/testing/dhHighlights
go to PRODUCTS and you can see what is happening. Any ideas as to why this might happen? Not sure if this is a CSS or HTML issue so I included both below.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Majestic Windows</title>
<link href="css/majesticStyles.css" rel="stylesheet" type="text/css">
<link href="css/topNav.css" rel="stylesheet" type="text/css">
<link href="css/sideNav.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="favicon.png" />
</head>
<body>
<?php include("includes/header.php"); ?>
<?php include("includes/topNav.php"); ?>
<div id="content">
<?php include("includes/sidebarDH.php"); ?>
<div id="contentRight">
<div id="bodyCopy">
<h1>Majestic Signature Series <br>
    Vinyl Windows & Doors</h1>
<h5> </h5>
<h2>Designed to express the way you live your life, Majestic windows can help you create a home that is as unique as you are. There are many reasons to replace your old windows with new vinyl ones and Majestic windows make it easy.</h2>
   <h5> </h5>
<h2>Our vinyl windows are strong, durable, energy efficient and are all designed for performance, beauty, and dependability.
<h5> </h5>
    </h2>
<h2>Choose from a variety of sizes and styles including double-hung, casement, awning, bay, bow, and picture windows.</h2>
</div>
<div id="beautyShot">
<img src="images/index/indexBeauty.jpg" width="380" height="373" alt="Beauty Shot">
</div>
</div>
<div id="indexBodyBottom">
<div id="dealerButton">
<a href="dealer"></a>
</div>
<div id="litDownloadText">
<strong><a href="literature">Download the Majestic Brochure</a> </strong></div>
<div id="litImage"><a href="literature"></a>
</div>
</div>
</div>
<?php include("includes/footer.php"); ?>
</body>
</html>
topNav CSS:
/* main menu bar */
ul#menu {
    margin: 0;
    padding: 0;
/* submenu2 no appear on first level hover */
#menu li:hover ul ul {
    display: none;
/* main menu */
ul#menu li {
    list-style-type: none; /* no bullets */
float: left; /* keeps horizontal */
position: relative; /* keeps in line */
/* main menu links not hovered */
ul#menu li a {
    color: #FFFFFF;
    display: block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    line-height: 28px;
    padding: 5px;
    text-align: center;
    text-decoration: none;
/* submenu individual items */
ul#menu ul.sub-menu li {
    background-color: rgba(52, 85, 56, 0.9);
    border-top: 1px solid #FFFFFF;
    list-style-type: none;
float: none; /* keeps blocks even */
/* entire submenu */
ul#menu li ul.sub-menu {
    display: none;
    left: -20px;
    position: absolute; /* keeps menu from pushing down content - goes over it */
    top: 38px;
    width: 165px;
/* submenu links not hovered */
ul#menu li ul.sub-menu li a {
    line-height: 19px;
    padding: 10px;
/* shows submenu on hover */
ul#menu li:hover ul.sub-menu {
    display: block;
/* all links */
ul#menu li a:hover {
    color: #CCCCB4;
-webkit-transition: color 200ms ease;
-moz-transition: color 200ms ease;
-ms-transition: color 200ms ease;
-o-transition: color 200ms ease;
transition: color 200ms ease;
/* entire submenu2 block */
ul#menu ul.sub-menu li ul.sub-menu2 {
    left: 126px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 165px;
/* shows submenu2 on hover */
ul#menu ul.sub-menu li:hover ul.sub-menu2 {
    display: block;
sideNav CSS:
#sidebarGrad{
width: 245px;
height: 497px;
background: rgb(134, 100, 63);
background: -moz-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -webkit-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -o-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -ms-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: linear-gradient(0deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
ul#menuSide {
    padding-top: 43px;
padding-left: 0;
margin-right: 32px;
margin-left: 32px;
margin-top: 0;
list-style:none;
position: relative;
ul#menuSide li {
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
color: #F5F5EC;
height: 37px;
line-height: 37px;
text-align: right;
ul#menuSide li a {
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
color: #F5F5EC;
display: block;
padding-right: 20px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F5F5EC;
ul#menuSide li a:hover {
color:#A21029;
border-bottom-color: #A21029;
text-decoration: none;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;

I found my own answer to this one. I did some more research and added the z-index: 9999; property to ul#menu li ul.sub-menu. Worked perfectly!

Similar Messages

How to render side navigation menu programmatically.

Hi all,
I Have standard pages (i.e Customer online pages ) when I navigate one page to another page 2nd page have side navigation menu
This page is attached as first page in side navigation menu so by default this menu is displaying if I navigate from this page to
Author pages using keep_menu_context it is displaying to all author pages.
Now my requirement is I need to go 3rd page from 1st page on that time the menu is not displaying (side navigation menu).
Thanks in advance....
Regards,
Sridhar.

If I understand your requirement you're looking for something like this: http://deluxe-menu.com/sound-support-sample.html
Under 10.1.3 using ADF Faces I don't believe there is a component available to achieve this. Potentially under 10.1.3 you'll need to look to a 3rd party Javascript solution. Whether this will work with ADF Faces + JSF navigation is questionable. Potentially others on the forum can comment.
As an alternative solution under 10.1.3 you may want to look at using an af:tree component instead. It wont be as nice as the solution shown above, but will give you a multilevel menu selection.
Regards,
CM.

My Side Navigation menu and spry tabbed panels aren't working together. Can I fix this?

I have made some tabbed panels, but my side navigation is not working correctly now. See the following page for an example. http://www.foxthermalinstruments.com/products/index.php When you mouse (hover) over "Applications" on the side navigation menu you can see that some of the options are covered up by the tabs on the tabbed panel. If you try to hover down to one of the options that is covered or below the tabs on the tabbed panel the side navigation menu disappears. BTW, I am using Dreamweaver CS6.

I have to be brutally honest. I refuse to use Spry. Adobe abandoned the framework late last year after practically ignoring it for 3-1/2 years. It served it's purpose for a few years but it doesn't hold up well in newer browsers like IE10 and touch screen devices.
Keep using it if you want but I don't have much interest in fixing something that is inferior to begin with.
My advice is to run away from Spry. Either switch to jQuery or get any of the excellent commercial extensions from Project Seven. You'll be glad you did.
http://jqueryui.com/tabs/
http://users.tpg.com.au/j_birch/plugins/superfish/
http://www.projectseven.com/
Nancy O.

How to make side navigation menu using ADF

Hi,
I wanted to make a side navigation menu, like, there is a vertical menu and if I place the cursor on(or select) one of the menu item and it shows the children menu items sideways( having go links).
How can I achieve that?
I am using Jdev 10.1.3.3

If I understand your requirement you're looking for something like this: http://deluxe-menu.com/sound-support-sample.html
Under 10.1.3 using ADF Faces I don't believe there is a component available to achieve this. Potentially under 10.1.3 you'll need to look to a 3rd party Javascript solution. Whether this will work with ADF Faces + JSF navigation is questionable. Potentially others on the forum can comment.
As an alternative solution under 10.1.3 you may want to look at using an af:tree component instead. It wont be as nice as the solution shown above, but will give you a multilevel menu selection.
Regards,
CM.

Best way of having left-side navigation menu?

Hello Folks,
I'm interested in developing an application using JSP and the design requirement is that it should have a left-side navigation menu. Is there an Oracle recommended way of doing this or should I resort to using DHTML? In addition, please let me know if you have any suggestions.
Thanks!

You have two parts in your question: left side navigation menu;
You can define and use templates (HTML Templates) for your Pages in the Portal to structure your pages, such that Navigation or navigational tools can be placed on the page wherever you like. That is for the positioning of the navigational tools.
To define your navigational tools (menus, for eg), you may still use DHTML and/or a combination of other methods.
hope that helps!
AMN

Page won't open that's linked but not in the navigation menu

On my photos page I have set links from each of the photos to another page.
As long as I keep the page in my navigation menu it opens.
But when I uncheck that option, clicking on the photo opens up a pop up with an original size version of the same photo.
I don't want the page to appear in the navigation menu as it is a submenu of the photo page.
Is there any way for me to get the page to load without having it in the navigation menu?
Is the photo pop up a function of the photos page, and therefore I have to use another page template so this doesnt happen?

How did you make the links on the photo template page?
I'm wondering if this write up might help you...
http://www.mac.com/web/en/Blog/013C4180-4787-4847-BAAB-319222AFC652.html
Also, it might help if you could post your URL so that we can take a look.

Hi, the website i made is not showing the navigation menu in chrome or IE8, but in Safari and Firefox

What can i do to resolve the problem?
I use iweb 3.04 and OSX 10.7.2
I have 3 different websites an they are all showing the same.
Who can help me?

Read this :
https://discussions.apple.com/message/16641059#16641059

Iweb page modified with a simple html editor , now not display navigation menu

Hello i've designed a site http://www.ballettgastini.ch with Iweb and was working till i've the needs to update a simple text in one page and get it via ftp from the server, modified with a simple html editor !!!!, and update via ftp on the server. now the page do not diplay the navigation menu bar !!!! the page is here : http://www.ballettgastini.ch/stundenplan.html ... any suggesion ? i'm working now with a new imac with no possibility to modify the entire web site on the server...but the need it's really to change few text lines so i think to use a simple html editor... any ideas ? thanks luca giay turin italy

Why not continue in the topic you started earlier?
https://discussions.apple.com/message/21158910#21158910
Anyway, the scripts folder with essential files is missing :
http://www.lakesweddingmusic.com/Scripts/iWebImage.js
+ more
And this is missing too :
http://www.lakesweddingmusic.com/feed.xml
No feed, no menu.
And we keep finding more webpage. This one is made with iWeb 1
http://www.lakesweddingmusic.com/The_Barn.html

Suddenly no links in Navigation menu

I am building an iWeb site with several pages. They showed perfectly every link to the other pages in the naviagtion menu.
Out of the blue, when I opened iWeb today, all links in the navigation menus are gone: only an empty box is left unterneath every pages title. What's wrong?

Same problem with .mac server! Only after upgrade to iWeb 2.0.2
Black dot appears on left of screen where the navigation menu should be. (Navigation Menu is checked) Also the Photo Albums and Photo pages do not display any albums or photos. I am viewing the .mac site on a mac with Safari and Firefox.
When exported to a local file or a 3rd part server the site works as expected but no luck on .mac.
Using iWeb 2.0.2, with darkroom theme.
No success with iWeb 08 and .mac. Anyone found a fix or work around yet?

Best approach -Tabs based ADF Tree left side navigation with Dynamic Regions with out UI Shell

Hi,
Somebody can help for the best approach to implement the following requirement.
Req: When the user select the ADF Tree left side navigation menu, each menu will open as multiple tabs(Dynamic Tabs) in right side content area with out UI Shell Template.
I completed the
Step-1: From the Model project, I can able to render ADF Tree in the using view and view links. I can get the adf tree which is having 3 menu items. Each menu item having 2 sub menu's.
I took each menu item as one(1) taskflow, each taskflow will have two(2) fragments.
Total I have 3 task flows as Menu Items and 6 fragments for sub menu's.
Step-2: My question is How do I implement Tab based the ADF tree navigation (left side area to dynamic regions in content area) through dynamic regions? Please provide the steps in view layers.

Than ks for your response.
This is working fine for ADF Tree navigation with dynamic regions if the taskflow having only one fragment. if the taskflow having more than one fragments, this will not work. The following conditions are always satisfies one page fragment of either "employees" or "departments" task flow. If the "employees" task flow have 2 page fragments, it's not work even you pass parameters through routers.
public TaskFlowId getDynamicTaskFlowId() {
if (currentTaskFlowID == null ||
currentTaskFlowID.equalsIgnoreCase(“employees”)) {
return TaskFlowId.parse(employeetaskFlowId);
if (currentTaskFlowID != null &&
currentTaskFlowID.equalsIgnoreCase(“departments”)) {
return TaskFlowId.parse(departmetaskFlowId);
return TaskFlowId.parse(employeetaskFlowId);
My question is "Same use case with Dynamic Tabs" when the user click on any adf tree node.

Java.lang.IndexOutOfBoundException on clicking side navigation link

Hi,
I have to dynamically invoke a side navigation menu from Page 1,
Here is the code that I have written:
Process request:
public void processRequest(OAPageContext pageContext, OAWebBean webBean)
super.processRequest(pageContext, webBean);
// Starting a new transaction to avoid any back navigation error
if (!pageContext.isBackNavigationFired(false)){
if (!TransactionUnitHelper.isTransactionUnitInProgress
(pageContext, "partChangeTxn", true)){
TransactionUnitHelper.startTransactionUnit(pageContext, "partChangeTxn");
if (!pageContext.isFormSubmission()){
// Side Navigation Menu
String recPartChanges =
pageContext.getMessage("XXGAHL", "XXGAHL_OSP_REC_PART_CHNG_Q", null);
String viewPartChanges =
pageContext.getMessage("XXGAHL", "XXGAHL_OSP_VIEW_PART_CHNG_Q", null);
//Get the side Navigation Links.
OASideNavBean sideNav =
(OASideNavBean)createWebBean(pageContext, OAWebBeanConstants.SIDE_NAV_BEAN,
null, "sideNav");
//Record Part Changes Queue
OALinkBean recPartChangesQueue =
(OALinkBean)createWebBean(pageContext, OAWebBeanConstants.LINK_BEAN,
"VARCHAR2", "recPartChangesQueue");
recPartChangesQueue.setText(recPartChanges);
recPartChangesQueue.setDestination
("OA.jsp?page=/kal/oracle/apps/xxgahl/osp/webui/XxgahlOspPartChangesPG");
sideNav.addIndexedChild(recPartChangesQueue);
recPartChangesQueue.setSelected(true);
//View Part Changes Queue
OALinkBean viewPartChangesQueue =
(OALinkBean)createWebBean(pageContext, OAWebBeanConstants.LINK_BEAN,
"VARCHAR2", "viewPartChangesQueue");
viewPartChangesQueue.setText(viewPartChanges);
viewPartChangesQueue.setDestination
("OA.jsp?page=/kal/oracle/apps/xxgahl/osp/webui/XxgahlOspViewPartChangesPG");
sideNav.addIndexedChild(viewPartChangesQueue);
viewPartChangesQueue.setSelected(false);
OAPageLayoutBean pageLayout = pageContext.getPageLayoutBean();
pageLayout.prepareForRendering(pageContext);
pageLayout.setStart(sideNav);
This is rendering properly.
However, I want the same side navigation in the called page. When I write the same code in process request of called page (i.e XxgahlOspViewPartChangesPG); and try to click on the link from the Page 1, I get "java.lang.IndexOutOfBoundException". But, if I do not write any side navigation invoking code in the process request of called page, I get no error.
Please help.
Regards,
Farrah

hi
would u please provide the complete error stack
thanx
Pratap

Navigation menu not showing up

Hi,
I am creating a site using iWeb and have uploaded it to my web host and all runs fine... except for the navigation menu, which is kinda important. I know i could make my own, but I would like to use the default one anyway.
So everything looks fine in iWeb. Here is a screenshot showing the default navigation menu (I am using the darkroom theme)
But when I publish to my server and view through safari (have also tried Firefox and get the same results), this is what I see where the navigation menu should be:
There is no light grey horizontal box, no writing, just a black dot point. The dark grey on the sides is normal, its not in the iweb screenshot because my window wasn't very wide.
I tried disabling the menu, re-publishing (which removed the dot point), enabling it again and re-publishing but I still get the same issue.
Any ideas on why I can't get the menu??
Cheers.

I had the same issue. It's a cache settings problem. I resolved it this way:
Go to Firefox > Preferences > Advanced > Network
On that screen under the 'Cached Web Content' section, UNCHECK the 'Override automatic cache management' check box.
Then quit Firefox entirely and restart it. Should do the trick.
Peace out
SL

Detailed navigation menu does not appear.

Dears, some users in our system, can not see the Detailed Navigation Menu (menu on the left side of the portal). Almost all users have the same profile called "EVERYONE" and see the same features. Only some users complain that they can not see the left menu. Someone has seen something similar?
Thanks
Marcos

Hi Marcos,
Do these users have more or less tabs (top level navigation)? Do the details not show up in every tab or only certain tabs? What if you log onto those PCs with another account (e.g. admin)? I'm trying to figure out whether the issue associates with the user accounts. Any other differences that you noticed which might help narrow down the problem? Otherwise, since you mentioned that users have the same roles, platform environment/configuration, ... there shouldn't be any reason why the portal would behave differently.
Regards,
Dao

Navigation Menu not showing in mobile

I'm working on this website and when I view the site on my iPhone, the navigation menu is not showing. Any advice on what is preventing the menu from showing?
Thanks in advance for your help,
Michael

That was it Ben. This site is actually one I designed several years ago and the customer just wanted to make some changes to color scheme and add a few new tabs. Figured I would add a dropdown menu to better accommodate the additional pages and found a nice nav menu online. I didn't see that the styles had media queries. I have not begun to code them myself yet, only have worked with responsive formats with Wordpress.

Navigation menu--not centered

Mac gurus,
When I transferred my site to iweb 08, many things were different, but the one thing that I can't fix is the navigation menu. After reading some posts, I am nervous about publishing it, but even before I publish it, I would like to CENTER the navigation menu. The text block itself is still centered on the page, but the hyperlinks are now lined up on the left side of the text block.
I am unable to highlight anything in the text block in order to make the hyperlinks centered.
Any thoughts?
Thanks for your help, as always!
Lara Walker
Message was edited by: Doug & Lara

I feel your pain!
The funny/worst thing is that I have added 2 new pages since I posted the original request for help: one blog and one movie page. The blog page that I added is in a different template and it centered the navigation menu with no problem. The movie page that I added is in the same template as the original website and the navigation menu is un-centered just like the rest of the pages. Bizarre!!! I thought that a new page would not have the same issues as the old pages do upon transfer.
Lara

Dropdown Menu Not Covering Side Navigation Menu

Similar Messages

Maybe you are looking for