Forum Moderators: open

Message Too Old, No Replies

Problem with DHTML script

Need a little help from my friends

         

DrOliver

8:21 am on Aug 27, 2002 (gmt 0)

10+ Year Member



I found this tutorial at DHTML Central:
[dhtmlcentral.com...]

(Not quite sure if is okay to include this URL - if not: admin please cut, helpers, if URL is out: please use sticky mail)

It tells how to build dynamic menus using XHTML, CSS, and the DOM. Said menus can be viewed in any browser (including a text browser) and the CSS and markup validate. (cite: Zeldman)

I have this in my menu:

<ul id="myMenu">
<li><a></a></li>
<li><a></a>
....<ul>
........<li><a></a></li>
....</ul>
</li>
<li><a></a></li>
<li><a></a>
....<ul>
........<li><a></a></li>
....</ul>
</li>
</ul>

I want the second <ul> to be open by default. The script sets the display value of all nested <ul>s to "none". I did not find a way to modify the script so that it allows to have selected <ul>s open by default. My <ul>s all have unique IDs, so I could address them in the script. Bot how? I guess one more if-else or an body-onload would help, but I'm not a scripts guy. Thanks for any help.

tedster

7:09 pm on Aug 27, 2002 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



The options for "display" are block ¦ inline ¦ list-item ¦ none

Let's say the id of the particular UL you want to make visible is called #critical. Basic css for making that id visible would be:

#critical {
display:list-item
}

How to insert that declaration into the page? That's something you'll need to experiment with. I don't think a simple css declaration for the ID will do it -- you'll need a way to set it after the basic script runs through its loops. You want to overwrite the default display that the script creates for the class of nested elements.

School is back in session and it looks like you've got homework, my friend ;)

By the way, I notice that the script was create by Thomas Brattli and posted just last week. He's done some fine work over the years and often made it available for free. The tutorial also looks pretty well written. With a little digging and perhaps looking up some js syntax here and there, I'll bet you can make it happen the way you want.

moonbiter

7:53 pm on Aug 27, 2002 (gmt 0)

10+ Year Member



The short answer: in the ul part of the script, set
temp.style.display = "none"
to
"block"
.
See the CSS Recommendation [w3.org].

tedster

7:55 pm on Aug 27, 2002 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Whoops - you're right! It would be block for a <ul>, and not list-item.