Basic Slashdot customization

[ddixon]

1) Script Title: Slashdot Menu

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

3) Describe problem: Although pretty much a newbie, I've successfully customized the text, colors, width, etc. of my use of the Slashdot Menu, and have even made it a library element in Dreamweaver that is successfully working sitewide. But, I don't understand the use of the included .html file. It has all these customization features (default collapsed states, using cookies to remember the state of the menu, etc.) and it says you can use these to customize the Slashdot Menu. Uh, well.....how?

There is a form with buttons, and also script examples. Where do these go? the .js file? hidden in the .html? How do I make these take effect but not appear on the page like they do in the sample at the URL above?

I don't want anything fancy, just want the page to open with only the first Menu expanded, all others collapsed, and then have it retain whatever changes to that the user makes.

I did search, and no one else seems to have had this question so far. So, I'd appreciate any direction someone can give.

Thanks, D Dixon

[DimX]

Well, to make a submenu be collapsed by default, you have to add class="collapsed" to the div tag, like here the third submenu is collapsed by default.
To make the menu remember submenu states, the remember property must be set to true, but that's what it is by default, so I guess you don't have to touch it.

[jimk]

I would like to know how I can change the color of the menu buttons. I have copied the "toptitle.gif" and give it another name, changed the color and put the new gif in place of the old one in the CSS but it didn't work, any ideas?
Also,
Can you tell me what this script does?
<script type="text/javascript">
// <![CDATA[
var myMenu;
window.onload = function() {
myMenu = new SDMenu("my_menu");
myMenu.init();
};
// ]]>
</script>

Thanks,

JimK

[ddixon]

Well, to make a submenu be collapsed by default, you have to add class="collapsed" to the div tag, like here the third submenu is collapsed by default.

Thanks for the reply! I think the problem may be that I've done the SDmenu in Dreamweaver as a Library item on multiple pages. So, when I expand a submenu and then click one of its links, the new page that loads shows the submenu still collapsed. Any way to retain those user changes sitewide? I haven't tested it online, just by previewing in a browser from DW.

To make the menu remember submenu states, the remember property must be set to true, but that's what it is by default, so I guess you don't have to touch it.

OK, now you're assuming I know more than I do

Where do I change those properties? After looking around, I found some entries at the top of the sdmenu.js file that look like the customization options listed in the demo file. Is the .js file where you make those changes? Mine has remember set to true, but as explained above, is not remembering in the way I would like. I've not made any changes to the .js file at all.

Appreciate the help!

David Dixon

[ddixon]

I would like to know how I can change the color of the menu buttons. I have copied the "toptitle.gif" and give it another name, changed the color and put the new gif in place of the old one in the CSS but it didn't work, any ideas?
Also,
Can you tell me what this script does?
<script type="text/javascript">
// <![CDATA[
var myMenu;
window.onload = function() {
myMenu = new SDMenu("my_menu");
myMenu.init();
};
// ]]>
</script>

JimK:
I'm very new at this myself, but will take a stab at this.

If you really mean to just change the color of the .gif, then I think you'd have to give the new one the exact same name for the graphic to display. If you must have a different file name then you'd have to change the name everywhere it appears in the .css file to match the new name.

The second part of your question is way over my head. As you may can see from a couple of postings earlier from me, I love this menu and have enjoyed working with it. As a novice, I've also learned a lot from studying the code and adapting it for my site. I still don't really understand, however, how to implement the customization options outlined in the demo .html file.

David Dixon

[DimX]

I haven't tested it online, just by previewing in a browser from DW.

That might be the problem.

<script type="text/javascript">
// <![CDATA[
var myMenu;
window.onload = function() {
    myMenu = new SDMenu("my_menu");
    myMenu.init();
};
// ]]>
</script>

This simply creates and initializes a SDMenu object.

[ddixon]

[QUOTE=DimX;100960]That might be the problem.


Yes. Fantastic. I didn't realize. Now that my site is posted on the server not only does everything work as needed, it even has little touches I wasn't expecting. For example, once on a page, mousing off the Menu leaves the current menu slightly darker gray than the others, serving to remind you which page you're viewing.

Thanks so much for this great menu and for your help in this forum today--awesome.

David Dixon

[bsquared0]

Well, to make a submenu be collapsed by default, you have to add class="collapsed" to the div tag, like here the third submenu is collapsed by default.
To make the menu remember submenu states, the remember property must be set to true, but that's what it is by default, so I guess you don't have to touch it.

DimX - I tried your solution to collapse submenus. It does collapse it on page open, but when I click a submenu down further, say the fourth or fifth, the submenus between number 1 (which I like opened) and the last one completely disappear.

All I'm trying to accomplish is to open each page (each has a complete menu and the code) and have the first menu item opened and the rest closed. I have not been able to get the correct initialization combo to do it, so right now I'm using the myMenu.collapseAll() until I can get it worked out.

My site is at mcgymswim.com and would much appreciate help on this terrific menu.

Regards - bsquared

[bsquared0]

DimX - Well we can forget the request. I revisited my code and realized I made a sloppy error: I added <div class="collapsed"> after the existing <div> tag thus duplicating it. It surprised me that it worked at all.

Anyway, thanks for putting the code out here. It is a great menu.

Regards - bsquared