View Full Version : Smooth Navigational Menu - Shadow Problem Urgent Help

11-21-2008, 07:25 AM
1) Script Title: Smooth Navigational Menu & Master Page

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.htm

3) Describe problem:

We are having a problem with the Dynamic Navigation called Smooth Navigational Menu.
We are getting ready to launch our site, I am not a programer just a designer.

1.) We have tested it several times with just a few navigation items in the bar and it worked fine. Now we started to expand the menu, and the shadow is causing not to align in the right spot when the menu drops down.

The shadow does not show up over the background image, have tried to delete the background image, problem remains.

Test page Is:

2.) Issue number two, we want to use a DIV Tag to align Our Title “Circle Chair” Over the background image. Is there a special Z index number to use because right now the navigation interferences with the Title on some browsers.

Please advise,:(
Thank you

11-21-2008, 07:57 AM
Hmm I tried playing around with your page, though can't quite spot why the shadow is aligned incorrectly yet. If this is urgent a temporary fix would be to just disable the shadow inside the .js file:

shadow: {enabled:false, offsetx:5, offsety:5},

Issue number two, we want to use a DIV Tag to align Our Title “Circle Chair” Over the background image.

Are you saying the drop down menu when it drops over the "Circle Hair" title becomes hidden behind it?

11-21-2008, 07:13 PM
Are you saying the drop down menu when it drops over the "Circle Hair" title becomes hidden behind it?

Yes correct, The drop down nav appears behind the floating div, if the div with the title is enabled.
How to fix this issue?

11-22-2008, 09:57 PM
Try giving the "Circle Hair" container a high CSS z-index, for example:

<A HREF="http://www.lebello.com/Circle.shtml"><font style="" onMouseOver="this.style.color='FFFFFF'" onmouseout="this.style.color=''" color="#3399FF" style="z-index:500">Circle Chair ></font></a>

11-23-2008, 05:28 AM
I have tried setting the Z-Index on the Title"Circle Chair" none of them solve the problem. The drop down menu will not appear over the div tag. it must be something in the js code, or smoothmenu code, because I don't see anywhere any specifications for which Z-layer it should be using.

I have also removed all of our modified code and pasted the original js and css stylesheet and navigation menu into the page. The problem with the drop down menu remain.
I have a feeling that it has problems to render a drop down menu over images.

It seems to be a bug in the code. Please let me know once this has been resolved since we really like the shadow effect.

11-23-2008, 08:23 AM
Hmm I don't see why the drop down menu would be hidden behind the blue "Circle Chair" text, especially with a z-index given to the later. That text is merely a plain text link on the page. Typically the issue you're talking about only occurs with embedded objects such as Java applets or Flash, but definitely not regular text. In FF3 btw, I don't see that issue at all on your page.

Regarding the shadow issue, I'll have to take a look at it closer when I have more time. It seems under select circumstances it can be positioned incorrectly.

12-03-2008, 04:48 AM
I also got some problems with the shadow effect using IE 7.0.6000.16711 on Vista. Another testbed is IE 6 on WinXp.

In the example above, somehow the shadow for the 3rd tier submenu is pre-drawn, even though my cursor is still at the 1st tier submenu. This prob doesn't occur when the 1st time I hover the cursor after the page reload.

Here, the shadow for other than 1st tier submenu is lost. FYI this anomaly also happened when using Firefox 3.0.4. This prob occur when I move the cursor real quick.

the 2nd prob also occurred on DD site..

12-03-2008, 08:12 AM
I am aware of the 1st issue you cited arelanz, but not the 2nd. Either way, I do plan to take a closer look at the shadow effect once I have time to see if it can be overhauled somehow. The shadow was the last thing added to the script before it was released, and somewhat hastily.