...

View Full Version : Looking for a CSS Horizontal Dropdown Menu



katie_lostsoul
07-09-2007, 06:33 PM
Anyone know of any nice ones that don't use javascript? Thanks

VIPStephan
07-09-2007, 06:40 PM
You can't do without JS if you wanna enable the use of such a menu for users of IE 6 but one of the best menus is the Son of the Suckerfish (http://www.htmldog.com/articles/suckerfish/dropdowns/). A simple search for a CSS drop down menu before asking this question would have brought you to the same source, though. :rolleyes:

katie_lostsoul
07-09-2007, 06:46 PM
I searched through 10 pages of CSS horizontal menus but none that actually look good....most of them look childish. So I did look :p

So you can't have a dropdown without using Javascript? I wanted to get rid of the user having to enable the script when getting to the site.

I found that site during my search and I don't like the menu - it looks awful

VIPStephan
07-09-2007, 07:02 PM
(...) it looks awful

You seem to have missed an important development in webdesign lately... How something looks doesn't matter at all because you can make it look anything you want (Ever heard of CSS? That's a new method if styling websites).

If you have read the entire article thoroughly you should have noticed that the example there is just a very basic one and it's on you to give it the look you want. But from a functional point of view this is one of the cleanest and most accessible menus (code wise) that you can have.

Technically it's working without JS. Only that pile of crap called Internet Explorer (version 6) can't handle it and requires the small Javascript. If you don't care about IE users then you can leave the script and use the menu without if you like.

Jutlander
07-09-2007, 07:02 PM
I searched through 10 pages of CSS horizontal menus but none that actually look good....most of them look childish.

Then style it to suit your needs. ;)

How about this: http://www.cssplay.co.uk/menus/dd_valid.html

katie_lostsoul
07-09-2007, 07:09 PM
Then style it to suit your needs. ;)

How about this: http://www.cssplay.co.uk/menus/dd_valid.html

That one is more of what I'm looking for. Thanks!

Edit: I'm blind, where do I download it? Or do I have to rip the code?

VIPStephan
07-09-2007, 07:21 PM
Uhm... you know, building good websites yourself requires some work and dicipline, and you can't expect everything coming in perfectly done just to suit your needs (at least not for free). The least thing you could do is read the articles and solutions provided entirely and thoroughly. Everything is explained on that page. You can even download the stuff, you just have to read the page!
And then please don't just copy and paste stuff, learn from the solutions and suggestions we give you. This means you have to study the code, too.

Oh and by the way: That CSSplay menu isn't as good as the Suckerfish because it uses more code than necessary (and abuses tables for layout).
Again, just because it looks nice to you doesn't mean it's good. You have to do the styling (or pay someone if you're not able to do it).

katie_lostsoul
07-09-2007, 07:24 PM
Before you go off being rude, I do have a diploma in Interactive Multimedia Development. CSS was one thing they did not teach so I am doing my best to learn on my own.

VIPStephan
07-09-2007, 07:42 PM
Nah, I won't get personal. And I don't know what a diploma in Interactive Multimedia Development means or includes but your posts invoked the assumption in me that you were only trying to get a quick solution without trying to improve your skills while doing that. As I said just because something looks appealing to you on first sight doesn't mean the "inner values" are good as well. And as you put on makeup to look more attractive when you go out you can apply any styles to any HTML to make it look more appealing, and you could make the same code look totally different, just as you like.

It may require a little more than five minutes but in the end you'll be glad you haven't just copied a bad example but understood and built your own menu.
And if you run into problems styling your menu you can always ask for help here. That's what we're there for. If you show true interest I (and I guess others as well) will be more than willing to help you.

Jutlander
07-09-2007, 07:49 PM
Let me just state that my intention by posting the link to CSS plays non-js dropdown menu, wasn't that one should just copy and paste it. I had actually not seen that tables were used before VIPstephan mentioned it. I thought Stu Nichols didn't use tables (because it's incorrect), but guess I was wrong.

katie_lostsoul
07-09-2007, 07:49 PM
I'm thinking I'll just stick with the javascript menu I currently have, as the CSS ones need a bit of javascript code anyway.

The problem is the activeX that pops up...I do have a no script tag for those who don't enable the javascript.

Is there a way to force the browser to allow the javascript? If not, is there a way to style the noscript tag's colour? Right now the text is black, on a black background....obviously you can't see it.

Thanks

PS: http://www.tombraiders.net/katie/MyTombRaiderStories.html was my first attempt at re-doing the other side of my site in CSS. I'd say I worked quite hard ...

VIPStephan
07-09-2007, 08:13 PM
Just so you know: The JS that is needed for the CSS menu is just to make the dropdown effect work, and only in IE 6. There is no ActiveX involved and modern browsers like Opera, Firefox, IE 7, Safari, Konqueror, etc. don't require this script at all. It's still much better than pure JavaScript menus as most of them are made that way that you can't see anything at all (or will get a lot of JS errors) if you don't have JS enabled. So the Suckerfish menu, despite not working if users of IE 6 have JS disabled, is still a better option since it will at least work in all modern browsers.

And no, there is no way to force a browser to support JS. One important thing in webdesign is not to force the user to do anything. Ideally the user has the option to view a website however she wants, with JS enabled or disabled, with or without Flash, CSS, images, and should still get the message without any restrictions. This separates the good web developers from the poor ones.

katie_lostsoul
07-09-2007, 08:20 PM
Well the one I have now has served me well for 5 years so I'm thinking of just keeping it.

I'll keep the other menus bookmarked in case I should change my mind.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum