Slashdot Menu

[0blivion]

Well i'm using the slashdot menu (http://dynamicdrive.com/dynamicindex1/slashdot.htm) and I want to add a link to the navigation thats not a drop down link I just want it to be a normal link you click on ex. Home. How would I add this?

[Schmoopy]

Here's my solution:

CSS:


div span a.firstlink{
display: block;
padding: 5px 25px;
font-weight: bold;
color: white;
background: url(toptitle.gif) no-repeat;
cursor: default;
border-bottom: 1px solid #ddd;
text-decoration:none;
cursor:pointer;
}

HTML:


<div style="float: left" id="my_menu" class="sdmenu">
<span><a class="firstlink" href="http://www.google.com">Stuff</a></span>
<div>
<span>Online Tools</span>
<a href="http://tools.dynamicdrive.com/imageoptimizer/">Image Optimizer</a>
<a href="http://tools.dynamicdrive.com/favicon/">FavIcon Generator</a>
<a href="http://www.dynamicdrive.com/emailriddler/">Email Riddler</a>
<a href="http://tools.dynamicdrive.com/password/">htaccess Password</a>
<a href="http://tools.dynamicdrive.com/gradient/">Gradient Image</a>
<a href="http://tools.dynamicdrive.com/button/">Button Maker</a>
</div>

May need a bit of modification if your link isn't at the top of the menu, but hope this helps you out :)

Edit: To put a link in, after the first item, use this for the background in the CSS, or make a new class if you want to have both:



div span a.middlelink{
display: block;
padding: 5px 25px;
font-weight: bold;
color: white;
background: url(title.gif) repeat-x;
cursor: default;
border-bottom: 1px solid #ddd;
text-decoration:none;
cursor:pointer;


So the new HTML would look like this:


<div style="float: left" id="my_menu" class="sdmenu">
<span><a class="firstlink" href="http://www.google.com">Stuff</a></span>
<div>
<span>Online Tools</span>
<a href="http://tools.dynamicdrive.com/imageoptimizer/">Image Optimizer</a>
<a href="http://tools.dynamicdrive.com/favicon/">FavIcon Generator</a>
<a href="http://www.dynamicdrive.com/emailriddler/">Email Riddler</a>
<a href="http://tools.dynamicdrive.com/password/">htaccess Password</a>
<a href="http://tools.dynamicdrive.com/gradient/">Gradient Image</a>
<a href="http://tools.dynamicdrive.com/button/">Button Maker</a>
</div>
<span><a class="middlelink" href="#">More Stuff</a></span>
<div>
<span>Support Us</span>
<a href="http://www.dynamicdrive.com/recommendit/">Recommend Us</a>
<a href="http://www.dynamicdrive.com/link.htm">Link to Us</a>
<a href="http://www.dynamicdrive.com/resources/">Web Resources</a>
</div>


And that's it, good luck,

Jack.