Jump to content

Welcome to Geeks to Go - Register now for FREE

Geeks To Go is a helpful hub, where thousands of volunteer geeks quickly serve friendly answers and support. Check out the forums and get free advice from the experts. Register now to gain access to all of our features, it's FREE and only takes one minute. Once registered and logged in, you will be able to create topics, post replies to existing threads, give reputation to your fellow members, get your own private messenger, post status updates, manage your profile and so much more.

Create Account How it Works
Photo

Help with Drop Down Menu


  • Please log in to reply

#1
STSchool

STSchool

    New Member

  • Member
  • Pip
  • 2 posts
I'm a teacher at a non-profit school who is building a website for our school. I used XHTML and CSS. Our principal wants a drop down menu and I have no idea how to do it. I've searched the web for hours and hours and can't find anything that works in IE. I was hoping someone could give me the code that I could insert into the documents? Maybe that's too much to hope for? We don't have a lot of money to spend on a site designer, which is why I'm doing it myself. Even if someone could direct me to a site that has a cut & paste code, I'd be forever grateful. If nothing else, we might possibly be able to pay someone to do a drop down menu, but it couldn't be a large cost.

Thanks for reading.
  • 0

Advertisements


#2
Major Payne

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
Do you want a simple inline menu which drops down submenu on a mouseover?

Two steps to install Simple Horizontal Menu.

Step 1: Either install following code on separate stylesheet or between the <HEAD> tags of an HTML document. Adjust styling to tastes:

<head>

<style type="text/css">
a:link {font: bold 80% verdana, serif, sans-serif; color: #006800; background-color: #e0ffff; text-decoration: none;}
a:active {font: bold 80% verdana, serif, sans-serif; color: #ffffff; text-decoration: none;}
a:visited {font: bold 80% verdana, serif, sans-serif; color: #900000; background-color: #e0ffff; text-decoration: none;}
a:hover { font: italic 80% verdana, serif, sans-serif; font-weight: bold; color: #0000ff; background-color: #fa8072; text-decoration: none; }

body { font-size: 1.00em; font-family: 'Trebuchet MS', 'Comic Sans MS', Georgia, serif, sans-serif, monospace; background-color: #6F6F6F; color: #202020; margin: 1%; }

.sidebaritem {
width: 120px; background-color: #bdb76b; color: #f4a460;
border: solid 1px #f4a460; font-weight: bold; text-align: center;
padding: 1px; margin-bottom: 5px;
}

.horiz {
float: left;
}
</style>

</head>
--------------------------------------------------------------------------------
Step 2: Insert following code between <BODY> tags of an HTML document:

<body>

<div class="sidebaritem horiz"><a href="futurelinks.html" title="Link One" target="_self">Link One</a></div><div class="sidebaritem horiz"><a href="futurelinks.html" title="Link Two" target="_self">Link Two</a></div><div class="sidebaritem horiz"><a href="futurelinks.html" title="Link Three" target="_self">Link Three</a></div><div class="sidebaritem horiz"><a href="futurelinks.html" title="Link Four" target="_self">Link Four</a></div><div class="sidebaritem horiz"><a href="futurelinks.html" title="Link Five" target="_self">Link Five</a></div><div class="sidebaritem horiz"><a href="futurelinks.html" title="Link Six" target="_self">Link Six</a></div>

</body>

Got a drop down jump on select menu if that's what you're looking for. Also other fancy menus are available at:

http://www.javascrip...sstopmenu.shtml


Ron

Edited by Major Payne, 15 July 2007 - 11:41 PM.

  • 0

#3
STSchool

STSchool

    New Member

  • Topic Starter
  • Member
  • Pip
  • 2 posts
Ron, thank you so much for responding.

I tried pasting in the first code that you provided, and I couldn't get it to work. I'm not sure what I'm doing wrong. I tried the Javascript kit link and I was able to get that to work. Only problem is, when I view it in IE, I got this message:

"To help protect your security, Internet Explorer has restricted this file from showing active content that could access your computer." I was then able to all blocked content, but our parents and visitors might be afraid to select that option and then the menu wouldn't work.

Does anyone out there know approximately how much it would cost to have someone put a drop down menu in the template we've already got? If it's not too much, I could present it to the school and see if they are willing to go that option.
  • 0

#4
Major Payne

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
Send me the template and tell me where you want it placed, i.e., top, top and bottom, centered, left, right or what. I'm retired and need the money, but will do it for free. Just mark it up to my contribution to better education. LOL

The menu code I posted here is working fine in my browser. Will take another look at it. As for the warning you get in I.E. after trying the JS link menu. That's IE's security setting over acting as the code only uses a CSS file with a JavaScript file to overcome IE's shortcomings. It can be scary, but you can try to not call the JS file and see how IE responds to it.

Ron
  • 0






Similar Topics

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

As Featured On:

Microsoft Yahoo BBC MSN PC Magazine Washington Post HP