Website menus - is using Javascript a problem?

[linda147]

I am just make some improvements to my website at the moment. I wanted to have a navigation bar across the top of each page under the title, but I want to have a drop down from a couple of the items. The only way I have found to do this without paying for some software (seems a bit extreme when I only want one menu!) is to use javascript. Is this likely to cause people problems when they view my site or does everyone just enable it? Does anybody know a better way of creating a drop down menu for free? What I want is something like GasconyMagic has on his site - which I think looks really good.
Grateful for any advice.
Thanks.

[e-richard]

Linda,

You can achieve something similar with CSS. There are a number of examples, which you can copy and modify for FREE here.

[Alan Knighting]

Linda,

You can achieve something similar with CSS. There are a number of examples, which you can copy and modify for FREE here.

Can image-free and JavaScript-free drop-down menus be created using CSS? I am sure they can but I am under the impression that they don’t work with Internet Explorer. Am I wrong?

Fluffy

[vrooje]

Linda,

Javascript is probably fine for the majority of users, but if in doubt you can always make the top part (the part that's visible before you hover) of your menu link to an intermediate page that shows normal links of your menu choices. That way even the rare person that has javascript disabled will be able to browse your site.

[debk]

I am sure they can but I am under the impression that they don’t work with Internet Explorer.

They are a bit tricky but they work! I have java-free CSS dropdowns on my website but I did have to add this bit of code to "help" IE recognize them.

<!--[if IE]>
<style type="text/css" media="screen">
body {
behavior: url("csshover.htc");
font-size: 100%;
}

#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}

#menu a, #menu h6 {
font: normal 0.7em/1.4em arial, helvetica, sans-serif;
}
</style>
<![endif]-->

All of which I learned courtesy of google and a few search terms like "CSS dropdowns"

Good luck!
debk

[e-richard]

Thanks Deb, I knew there was some fiddle needed, but could not find it.

By the way, looking at your website in IE7 I do not see the dropdowns (Our Properties and Links), but I do in IE6 and Firefox, so maybe its even a bit more tricky than that

[linda147]

thanks for the advice - I can't find another way of creating menus for free (that I can understand and I teach ICT!)
I think I'll try the javascript menus and see what happens - they do look much better than what I have at the moment.
By the way Debk I can't see your drop downs either on your menu (I use IE7 as well).

[mpprh]

Hi

I've been looking at this for a while. My current navigation is CARP. But I was worried about SEO implications.

However, these days with Google sitemaps, html sitemap pages, and more reliance on content search it should not be a problem.

And the menu linking URL's are in the code.

So, I've played with the site suggested, and come up with this :
http://www.the-languedoc-page.com/test.htm

Not finished! Lots of work to do, but I'll probably use it.

I'd be very happy to hear from people who can't get it to work, giving details of connection speed, platform and browser info.


Peter

[e-richard]

Very cool, Peter.

Works fine for me in IE7 on PC with WinXP at about 1mb broadband.

Only little thing I noticed was that all sub menus appear for a very short while at page load time. Do you also see this ?

I'll look closer at the code when I'm more refreshed and have the patience. Appreciate you putting it all in one file for testing

[mpprh]

Hi

Same thing happens for me in Firefox and IE6.

I'm not too upset. Those who are quick at least know where the menu is ?

Peter

[e-richard]

Of course.... its a feature, not a bug

[debk]

Thanks, all. I didn't know about the IE7 problems. (Was refusing to download it myself but looks like I've got to know on at least one PC. Sigh...)

If you don't mind, I'll tweak and bit and ask for some worldwide testing later.

Thanks again!
debk

[debk]

Anyone around this lovely Valentine's evening and willing to see if these dropdowns (eg, Links&Blog -or- Properties) now work with IE7?

http://visitingportugal.com/index-old.html

Thanks!
debk

[mpprh]

Hi

works fine for me with Firefox 2.0.0.1 / XP

But IE6 makes the boxes bigger, and two overflow to the second line. with text size plus grande (larger ?) .This then gets confused with overlapping drop down contents.

It just fits with text size set to normal (actually mine says moyenne).

Peter

[debk]

Hi, Peter - Thanks!

Yes, I know about the large text overlap... but I can't abide those tiny text websites and opted to have larger text in general. (Besides, if someone needs extra large text on my already good-sized-text site then they probably won't be able to navigate the stairs either. )

Did you happen to try with IE7?

Again, thanks for the detailed feedback. Much appreciated.
debk