This week's giveaway is in the Android forum.
We're giving away four copies of Android Security Essentials Live Lessons and have Godfrey Nolan on-line!
See this thread for details.
The moose likes HTML, CSS and JavaScript and the fly likes DHTML menu problems, keeps going and going... Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Android Security Essentials Live Lessons this week in the Android forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "DHTML menu problems, keeps going and going..." Watch "DHTML menu problems, keeps going and going..." New topic
Author

DHTML menu problems, keeps going and going...

Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

I am trying to create a DHTML meny that I can put on any page and not have to worry about positioning. So I am trying to make everything inside a Table and relative to the table cells. The problem is that the table cells are being set to the same height as the hidden drop down menu which pushed the rest of the page down. Can someone look at this code and see what I might be able to do to make this work better or give me a better solution to DHMTL menus all together.
Thanks

[ September 30, 2003: Message edited by: Eric Pascarello ]

GenRocket - Experts at Building Test Data
Chris Baron
Ranch Hand

Joined: Mar 21, 2003
Posts: 1049
Hi Greg,
since you use getElementById older browsers seem to irrelevant.
So you can use "display" instead of "visibility".
I also nested the divs

Sorry for the formatting, i copy&pasted yours, into my editor but it was only 1 line. So i just ironed over it with codesweeper
cb
[ September 29, 2003: Message edited by: Chris Baron ]
[ September 29, 2003: Message edited by: Chris Baron ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

That's a start. The only problem now is that when the menu displays, the table cell is still expanded to the height of the menu items. So it still wants to shift the rest of the page down.
Chris Baron
Ranch Hand

Joined: Mar 21, 2003
Posts: 1049
Oh yes,
whats about taking the div out of the table and positioning it absolute? Then you could park it pixel-exact under "about".

[ September 29, 2003: Message edited by: Chris Baron ]
[ September 30, 2003: Message edited by: Eric Pascarello ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

This was my problem to begin with. I cannot have any absolute positioning. My menu is in an included html file. So if I line it up correctly in the included file, it will not line up correctly on the parent page.
Thanks for the suggestion though.
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Gregg,
You are going to be stuck like that. You can use display:block and display:none and the border will grow with it.
You can put the submenus in a seperate cell and give that no borders, but this whole method is going to shift your whole page down.
I will try to come up with a solution later this afternoon when my project will die down.
Eric
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
I changed things around. See if this is what you were going for.....
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

I think that is perfect Eric! Thanks.
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

Everything about the latest script you wrote works pretty good. There is just one little thing that is happening and I am not real sure why.
Can someone look at this, http://gregg.embeddedthought.com/mom/index.html, and see if they can tell why the menu that shows up under "Crafts" is showing about 3 px lower on the y-axis than the About menu?
The code Eric gave works just fine. And everything I have is the exact same except for the extra parts of the web page, the Header, the body, the CSS. If you do a view source on the page, everything is in there.
I just can't figure out why my 1 of my menus shows up lower than the other one?
Also, I stripped out just my Menu Table, and put it on a page by itself, and it works just fine. So I think there is something else in my page that is screwing it up.
Thanks.
[ October 13, 2003: Message edited by: Gregg Bolinger ]
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

BTW - it is showing up differently in IE vs Mozilla. In Mozilla the Y-axis is lower all together. In IE one is lower than the other. ???
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: DHTML menu problems, keeps going and going...
 
Similar Threads
Positioning DIVs
giving link to an entire table row
resizing table width
DHTML drop down menu - Cross Browser
img tag under a table row