Email conversation
| From | Natasha Greer |
|---|
| To | Me |
|---|
| Subject | Javascript Object Error - Nested List Collapsing |
|---|
| Date | 17 February 2005 2:05 |
|---|
Hi!
I'm trying to implement your nesting list on my site. I went to your
nested list example with image additions from Nisad and copied the
source DIRECTLY from the page
http://www.howtocreate.co.uk/emails/NisadSivcevic/. I even added the
JavaScript source files. I uploaded everything to my server, but when I
try to run the code, all of the nodes are expanded and I notice a
JavaScript error. When I click to find out the error, I get 'object
expected'.
I think it has something to do with DOM. Do I have to do anything
special to my server to instantiate the DOM model? Your examples run
fine in my 6.0 browser, so why doesn't it work when I copy the source
directly? Ugh...
I'm trying to run this on an IIS server through IE 6.0.
Thanks. :)
Natasha Greer
| From | Me |
|---|
| To | Natasha Greer |
|---|
| Subject | Re: Javascript Object Error - Nested List Collapsing |
|---|
| Date | 17 February 2005 8:26 |
|---|
Natasha,
> when I try to run the code, I click to find out the error, I get
> 'object expected'.
aah, as ever, the _reaaly_ helpful IE error messages - not!
You would do yourself a favour by using a better browser. On Windows, both
Opera http://www.opera.com/ and Mozilla/Firefox http://www.mozilla.org/
offer JavaScript consoles which will give you a much more informative
message telling you exactly what the error is, where in the code it
happened, and exactly what object could not be found.
In Opera: Tools - Advanced - JavaScript Console
In Mozilla: Tools - Web Development - JavaScript Console
In Firefox: Tools - JavaScript Console
(Note, you do not need to install the Mozilla/Firefox DOM debugger)
[Ed. Note, there are other browsers with JavaScript consoles, but this is a
Windows user, and these are the best available for Windows. Other browsers
like iCab and OmniWeb offer reasonably good JavaScript consoles for Mac,
but not as good as Opera's or Mozilla/Firefox's]
> I think it has something to do with DOM.
If you copied the page exactly, then no, it should not be DOM. The script
itself takes care of all of that. From the sound of it, either the script
files are not being loaded, or the instruction to collapse the list is not
being defined correctly (but again, if you copied all the files, this
should not be a problem).
Is this page accessible on a public web server, so I can take a look myself?
This would be the easiest way for me to analyse the problem.
Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
| From | Natasha Greer |
|---|
| To | Me |
|---|
| Subject | Re: Javascript Object Error - Nested List Collapsing |
|---|
| Date | 17 February 2005 17:22 |
|---|
Thanks for the advice. I installed Opera today and sure enough, I can
see a well defined error message with my script. I still don't know what
it means (haha), but here's a link where you can check it:
[sample url]
Could there be an error in the listcollapse.js file? Maybe Nisad updated
the compactMenu() function so that it could handle custom images? Here's
the code (fromm your site) for that function:
[code showing that the function does in fact exist]
I don't know. Any help would be appreciated. :)
Natasha Greer
| From | Me |
|---|
| To | Natasha Greer |
|---|
| Subject | Re: Javascript Object Error - Nested List Collapsing |
|---|
| Date | 17 February 2005 23:01 |
|---|
Natasha,
Aah, I see the problem. You have edited the sourcecode and removed my comments :|
(please note that my terms of use ask you to leave the comments in:
http://www.howtocreate.co.uk/jslibs/termsOfUse.html )
in doing so, you also deleted a < character
Where your file has this:
y[x].innerHTML.substr(0, ( theA + 1 && theA theT ) ? theA : theT );
should have been this:
y[x].innerHTML.substr(0, ( theA + 1 && theA < theT ) ? theA : theT );
try downloading the script file again:
http://www.howtocreate.co.uk/emails/NisadSivcevic/listCollapse.js
That should fix it
Tarquin
| From | Natasha Greer |
|---|
| To | Me |
|---|
| Subject | Re: Javascript Object Error - Nested List Collapsing |
|---|
| Date | 17 February 2005 23:04 |
|---|
Odd. That must have happened when I copied the source code. Sorry about
that. It's working now! I won't TOUCH the comments anymore. (hehe)
Is there a way to convert this same code into a horizontal menu (with
images) as well? I've been researching codethese two and I'm about ready to
pull out my hair!
Thanks again!
Natasha Greer
| From | Me |
|---|
| To | Natasha Greer |
|---|
| Subject | Re: Javascript Object Error - Nested List Collapsing |
|---|
| Date | 18 February 2005 8:24 |
|---|
Natasha,
hehe, good to hear it's working anyway :)
If you want regular dropdown menus, it would not be easy to convert my code,
since it is specifically designed for collapsible lists. However, if you
want the menus to open only when you click, it is simply a case of applying
some styles that will do what you want. Something like this;
body div { width: auto; }
html body ul li a { display: inline; }
html body ul li { display: inline; position: relative; }
html body ul li ul { position: absolute; top: 1em; left: 0em; }
html body ul li li { display: list-item; position: static; }
html body ul ul ul { position: static; }
But this would need to be carefully tailored to suit each individual menu.
There have been many successful menus created using nested lists and a
simple script, however, but I have not made one yet. Maybe I will at some
point :)
Tarquin