Thread: Best link menu?

Please look at http://www.rhsclassof1965.com/roster.html
I used the Navigation button to create an index with links to different classmates pages but, since there are approx 140 links this is very slow loading (per sitetimer: 56K modem - 33 sec). It is easy to overlook this when you're using high-speed.

Which would be the best way to list these? Text Menu Hyperlinks, Menu Bar (using A - E , etc with drop downs, or ?

I have to admit I really liked the Navigation bars because the school colors are blue & gold. But I will sacrifice that for speed.
Thanks

Hi, CSS is the fastest way, this link may help. The menu's have no links, but will work fine when you replace the "#nogo" with your own urls.
http://www.metestsite.co.uk/css-menu.html

Thanks Chris,
I've been playing with this - I have no experience with CSS. Would you mind looking at the new page? http://www.rhsclassof1965.com/css-roster.html

Overlook the fact that I have the names repeated in each column. I will edit them (my previouus roster page is still linked online).

This page, as is now, shows loading on a 56K modem at 4.45 seconds. That is great.

How can I generate the CSS codes? I would like to change the text color to black, and perhaps do something more dramatic with the hover color? The hover now changes just the very edge and when you've been out of high school for 43 years the eyes are not like they once were. I assume if I had the codes I could edit those variables?
I really appreciate your help with this!
Thanks

Hi, you are certainly off to a good start! Bellow is only a guide, but as you will of worked out? the head area of the code controls the looks/style of the buttons. Have a play with these instructions & add some extra lines to the head area for styles & changes. There are a few extra lines of code to play with.
This site is a good place for some help & what css codes are available.
http://www.w3schools.com/css/css_text.asp

Good luck.



DON’T COPY THIS! ITS ONLY A GUIDE.Red is info Blue is the change.

<style type="text/css">
#menu a, #menu a:visited {
font-family: times; Change font on this line
text-decoration:none; Change text decor on this line .IE: bold;
background-color:#7ED0F2;Change background color of main button on this line
color:#000000;Main button text color
display:block;
width:8em; Button size
padding:0.1em;How far the buttons text is from the edge.
margin:0.2em auto;A sort of button border
border-right:3px solid #7ED0F2;Change right border size & color of main button on this line
border-left:3px solid #7ED0F2;Change left border size & color of main button on this line
border-top:3px solid #F6Bc1C;Change left border size & color of main button on this line
border-bottom:3px solid #F6Bc1C;Change left border size & color of main button on this line
}
#menu a:hover { All below this line is the mouse over changes.
background-color:#7ED0F2;Change background color of mouse over button on this line
border-right:3px solid #F6Bc1C; Change right border size & color of mouse over button on this line
border-left:3px solid #F6Bc1C;Change left border size & color of mouse over button on this line
border-top:3px solid #F6Bc1C;Change top border size & color of mouse over button on this line
border-bottom:3px solid #F6Bc1C;Change bottom border size & color of mouse over button on this line
color:#000000;Change the mouse over text color on this line. 000000 is black.
}
</style>

Many,many thanks, Chris. I'll play around with this and let you know when I get it finished.

Thanks again.

i am having problem with linking my page, i have followed all the stages in the tutorial but my pages are not linking, will anybody help me pls
umar

Danballaje,
I'm sure you'll get lost of help with your linking problem, BUT...you need to start a new Thread. At the top of the page, Find where it reads in Blue:
Web Hosting - BlueVoda Website Builder Forums - Hyperlinking - Making It aAll Come Together. Click on the Hyperlinking...and it will take you to that area. The 2nd sticky at the top gives directions for posting a problem. The main thing is be in the correct forum, start a new thread for your problem, and give you URL (http://www...) so people can go to your site to see the problem.
Good Luck

Sorry, that should read "lots of help" - I've been copying and pasting too much today!

Okay, I think I have it finished now. Please look at it and see if I've made any glaring errors. I have not replaced my original roster.html yet.
I did change the hover background color, font, and widened the bars a bit.
http://www.rhsclassof1965.com/css-roster.html

I really appreciate your help!

Hi, looking good & i bet it loads a lot faster?. You have missed out a “ ; ” after the sans ms.
Should be “font-family:comic sans ms;” It will also get rid of the underline on the links when corrected.
What might also be an idea is to add a single item of punctuation at the bottom of the page, about 40-50px down from the menu's & color it white so you cant see it. This will save the menu's finishing right on the base line of the page.


Good luck.

Chris,
I wondered why the font didn't change. Got that done and added the punctuation (/) whited out).
Many thanks for all of your help. It loads a lot quicker now.
Thank you.

No problem!

Good luck.