Smooth Navigational Menu (v1.4) submenus NOT showing

**bjl** · 03-02-2010, 04:16 PM

1) Script Title: Smooth Navigational Menu (v1.4)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm

3) Describe problem: I have this same menu working on my site, but I am testing out a second piece using the menu. I cannot get this working this time. None of my submenus show up. What is weird, is that the drop down(shadows) show as if there are submenus, but as soon as you try to hover over with the mouse, it disappears.

here is the link to the test website

everything else is default, except I use "sitemap.html" for the external data. inside that file, is pulled straight from the example on the dd link above.

I have been trying to get this to work for several days, but I am getting nowhere. it works on the other part of the site

thanx for any help.

**ddadmin** · 03-03-2010, 01:17 AM

There seems to be something in your layout.css file that's the culprit. If I either disable layout.css, or move the menu container:

Code:

<div id="smoothcontainer">
</div>

so it's outside the DIV styled by this file, then the menu appears. Check the contents of this css file to see what's causing the problem.

**bjl** · 03-03-2010, 02:51 PM

Originally Posted by ddadmin

There seems to be something in your layout.css file that's the culprit. If I either disable layout.css, or move the menu container:

Code:

<div id="smoothcontainer">
</div>

so it's outside the DIV styled by this file, then the menu appears. Check the contents of this css file to see what's causing the problem.

thanx! it was...man..i spent hours looking for that.

for future ref. a surrounding div had this in it, which caused the submenus to not appear
overflow:hidden;

thanx!

**bjl** · 04-08-2010, 03:46 PM

ok, i hate to resurrect an old thread, esp for something that is most likely NOT ddsmenu specific, but I am hoping someone here MIGHT be able to help.

I am getting close to finalizing my page, I have been testing in multiple browsers locally, AND on my personal website.(FF, Chrome, IE). My personal website is linux based package.

anyway, I go to show off my progress to my manager today, before we show the suits, and everything looks fine EXCEPT in IE, the menu is hiding again. The kicker is, it is ONLY on IE, and ONLY when hosting on IIS(our companies internal websrvers). I have no way around using IIS for the hosting package when it goes live.

Can anyone think of a reason, why Apache/Linux would host the exact same files correctly in all browsers, but IIS would host incorrectly in IE, but correctly in the others? it was back to the original problem, of the submenus hiding behind other div's..but only in one scenario.

I do not know enough about the differences in iis vs apache with IE. I did view source from both hosting within IIS, and saved them as HTML, then compared the text using beyond compare, they are exactly the same???

I am at a total loss now. thoughts?

thank you,

you can see the working site on linux/apache here unfortunately, I can't open up ports/redirects to show you the problems with IIS, and I don't have a current space for external hosting of IIS. I know that makes it much harder to help, but the code is all the same, copied from my local to both servers. The only difference is iis/apache.

**ddadmin** · 04-09-2010, 09:13 AM

Hmm are you sure the HTML output of the page on the IIS and Apache servers are identical? HTML and JavaScript are client side languages, and as long as two pages are identical- regardless of the server that output them- the browser should interpret them exactly the same.

I suspect there is something different with your page on the IIS server. Regardless, the standard suspects as far as culprits apply. The issue likely has to do with some CSS on your page. I'd start by selectively disabling the CSS for the parent containers of the menu, such as for the DIVs "#mainnav" and "#main-menu" and work your way up if necessary.

**bjl** · 04-09-2010, 01:47 PM

Originally Posted by ddadmin

Hmm are you sure the HTML output of the page on the IIS and Apache servers are identical? HTML and JavaScript are client side languages, and as long as two pages are identical- regardless of the server that output them- the browser should interpret them exactly the same.

I suspect there is something different with your page on the IIS server. Regardless, the standard suspects as far as culprits apply. The issue likely has to do with some CSS on your page. I'd start by selectively disabling the CSS for the parent containers of the menu, such as for the DIVs "#mainnav" and "#main-menu" and work your way up if necessary.

yes, I am 100% positive the files are identical, I replaced them on both servers at the same time(by deleting the folders, and uploading the folder from my local drive). I then navigated to each site, and within IE did [View -> Source]. I then saved the .html files into a local folder, and compared the text with BeyondCompare. I have done this procedure multiple times, with the same result. The files are identical between IIS and Apache, yet IE renders the html differently when it comes from IIS vs Apache OR local.

i have uploaded a zip file with the two source files.

I have started removing the main css elements from the div tags, and have no luck yet, but will keep going deeper into the sequence.

thanx again for the suggestion. I am just boggled about the fact that its only in one scenario, and that is the server its coming from.

**bjl** · 04-09-2010, 03:35 PM

further testing results.

I went to another computer, using ie7 instead of ie8. now, within ie7, the problem exist on both IIS and apache.

so, i know there is a problem, most likely in my css, which will take a lot of time to figure out. esp having to test on multiple servers and multiple browsers.

edit: I removed this, which surrounded several divs, including my menu, from my html, and that now works from IIS in both ie7 and 8,

Code:

<div id="header"> and </div>

this is all that was in the css, why would this break IE? I am at a loss here.

Code:

#header { 
	width: 100%; 
	padding:0; 
	margin:0;
	position: relative;
}

the good news is, its working, and the formatting stayed, so I am happy. My html just doesn't seem as clean, as I don't have a clearly defined header, but I cna live with that now

thanx for the suggestion of going through each css element!

**ddadmin** · 04-09-2010, 07:35 PM

I suspect it's the position:relative part that's the issue. Normally it shouldn't be with the menu, but in your situation when combined with some other CSS, it's confusing IE for some reason. If you remove that line but keep the rest, does the menu work?

**stellating** · 07-19-2010, 09:24 AM

hi,
i need your help urgently. I have used your code and it works well in firefox but not in internet explorer. when i move my mouse to the text tt has dropdown menu, there is nothing in i.e but in firefox it works perfectly. i tried using IE Tester to test and the error show:

'parent().get(...)' is null or not an object. Do you have any ideas what happened?

The website i and designing is not transfer to real website yet, i am currently using dreamweaver to do the coding.

Please help, your help will be appreciated.

**ddadmin** · 07-19-2010, 05:28 PM

Stellating, in the future please start your own thread when asking a question. Please post a link to the page on your site that contains the problematic script so we can check it out.