Problem with FF and SuckerTree Vertical Menu (v1.1)

[jmarien73]

1) Script Title: SuckerTree Vertical Menu (v1.1)

2) Script URL (on DD): http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/

3) Describe problem:

Greetings everyone! I am new to the CSS world and web development in general so I know that I am sure to make many mistakes. Thats how to learn it I guess.

My problem with this script is that it doesn't display correctly in Firefox. It works fine in IE 7 but in Firefox the menu shows as fully expanded and the menu items are displayed (without the option to expand the menu) all the way down the length of the page.

I receive an error from FF stating the following:


Error: [Exception... "Index or size is negative or greater than the allowed amount" code: "1" nsresult: "0x80530001 (NS_ERROR_DOM_INDEX_SIZE_ERR)" location: "http://xxx.html: 129"]
Source File: http://xxx.html
Line: 129
Line 129 in the js for my page is:


ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
Is there something simple here I am missing? Any help any of you could offer would be most appreciated.

TIA

[ddadmin]

Please post a link to the page on your site that contains the problematic script so we can check it out.

[jmarien73]

Yes! I suppose that would help eh?

here ya go:

http://www.megagate.com/~jmarien/vmenucss.html

[ddadmin]

The HTML for all your sub lists are broken/ incorrect. For example:


<li><a href="#Sales and Advertising"><strong>Sales and Advertising</strong></a></li>
<ul>
<li><a href="cnn.com">Advertising Work Order</a></li>
<li><a title="cnn.com">Order Logo Merchandise</a></li>
<li><a href="cnn.com">Ads on the Internet</a></li>
</ul>

It should be:


<li><a href="#Sales and Advertising"><strong>Sales and Advertising</strong></a>
<ul>
<li><a href="cnn.com">Advertising Work Order</a></li>
<li><a title="cnn.com">Order Logo Merchandise</a></li>
<li><a href="cnn.com">Ads on the Internet</a></li>
</ul>
</li>

The <li> needs to wrap around the entire <ul> sub list. You may want to refresh yourself on the syntax for lists in HTML. :)

[jmarien73]

Ah yes! Certainly a glaring omission on my part. However, that doesn't seem to have corrected the problem in FF :(

[ddadmin]

Nope you still haven't corrected the HTML markup. For example:


<li><a href="#Accounting"><strong>Accounting</strong></a></li>
<ul>
<li><a href="cnn.com">A/R Transaction Codes</a></li>
<li><a href="cnn.com">Credit Policies</a></li>
</ul>
</li>

The part in red doesn't belong there. Removing those closing tags fixes the issue in Firefox.

[jmarien73]

Sent you a PM thanking you, but I'll put it here for all the world to see as well! That worked. Thanks alot for your time. :)