Slashdot Menu

[SilverWolf]

1) Script Title: Slashdot Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/slashdot.htm

3) Describe problem: Well I have added this menu to a new layout I'm working on but I can't get it to contract.

I am totally self taught on the computer and don't understand some of the coding. Could you please check this: ftp://alittle:238c838@ftp.alittlebitofmagick.com/public_html/index.zip for me and let me know where I went wrong.

Thank you SilverWolf

[DimX]

Make sure that sdmenu.js file is where it has to be..

[SilverWolf]

Make sure that sdmenu.js file is where it has to be..


and where does it go?

[DimX]

Well in yout index.html you are pointing to sdmenu/sdmenu.js, is there a folder sdmenu with the file sdmenu.js in it?

[Jinga]

I understand the basics of java script and have used many of the Dynamic Drive scripts - The ones that tell you copy this and paste it above /head and copy & paste this where you want your menu, etc.

...but I am totally, completely confused on this one (slashdot menu). I've upload the js file and the css file to root where my index page is. I've uploaded to gif's to images/folder/

and I've tried a dozen times now to even get the menu to show up and cannot!

I LOVE the menu, but desperately need help (the detailed spelled out specifics) in getting it working.

ALSO, can the width be adjusted & the background color?

Please help.
Sleep depraived, & brain dead.
Kelly

[SilverWolf]

OK so I finally figured it all out and it is working great.


from Jinga

ALSO, can the width be adjusted & the background color?


To change the width:

div.sdmenu {
width: 150px;
font-family: Arial, sans-serif;
font-size: 12px;
padding-bottom: 10px;
background: url(bottom.gif) no-repeat right bottom;
color: #fff;



To change the main font color:

div.sdmenu div span {
display: block;
padding: 5px 25px;
font-weight: bold;
color: #oooooo;
background: url(expanded.gif) no-repeat 10px center;
cursor: default;
border-bottom: 1px solid #ddd;
}

- o marks the spot



To edit the background color of the submenu go into the css:
}
div.sdmenu div a {
padding: 5px 10px;
background: XXXXX;
display: block;
border-bottom: 1px solid #ZZZZZZ;
color: #066;
}


- X marks the spot to change the background color of the sub menus
- Z marks the spot to change the border color between the sub menu bars


To edit the mouse over:

div.sdmenu div a:hover {
background : #pppppp url(linkarrow.gif) no-repeat right center;
color: #ffffff;
text-decoration: none;
}

- p marks the spot for the background color
- f marks the spot to change the font color


I hope this helps :)