Email conversation
| From | Antony Ware |
|---|
| To | Me |
|---|
| Subject | Nested list collapsing script - slow to compact on a page with lots of content. |
|---|
| Date | 3 June 2005 15:57 |
|---|
Hi there
Thanks for a wonderful resource on "How to Create".
Your nested list collapsing script is excellent. The only issue I'm having
on a directory site I'm building is that the list isn't compacted straight
away, it as though its waiting for the rest of the images etc. to load
before the menu compacts itself, which visually isn't all that great. It
worked like a charm when I have a very simple page. Is there any way the
list can be "pre Compacted" or load first before all the rest of the page
content is loaded?
Also the plus/minus sign positioning, is there any way it can be placed to
the right of my text?
Any help would be greatly appreciated.
Kind regards
Antony
P.S. I'll happily include a link back to your site, on my "Credits" Page,
once my site is finished as specified in your Terms and Conditions.
| From | Me |
|---|
| To | Antony Ware |
|---|
| Subject | Re: Nested list collapsing script - slow to compact on a page with lots of content. |
|---|
| Date | 4 July 2005 01:14 |
|---|
Antony,
> the list isn't compacted straight
> away, it as though its waiting for the rest of the images etc.
Correct, with the normal configuration, it will wait for "onload". Some
browsers fire this once all images have loaded, others fire it as soon as
they have the dimension information for the images. If you want to avoid
this delay, you can call the script immediately after having laid out the
list.
The theory says that the browser may not appreciate my script playing with
the DOM before the page has loaded, but in practice all major browsers have
absolutely no problem with actually doing it :)
<ul>
...define list here...
</ul>
<script type="text/javascript"><!--
compactMenu('someID',false,'± ');
//--></script>
> Also the plus/minus sign positioning, is there any way it can be placed to
> the right of my text?
with a little modification, yes.
In the script source, change this line:
y[x].childNodes[0].innerHTML = oPM + theHTML.replace(/^\s*|\s*$/g,'');
to this:
y[x].childNodes[0].innerHTML = '<span class=\"gsty\">'+oPM+'<\/span>' +
theHTML.replace(/^\s*|\s*$/g,'');
Then you can add this to your stylesheet (or something else that suits your purpose):
li a span.gsty { float: right; }
li { clear: right; }
Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
| From | Antony Ware |
|---|
| To | Me |
|---|
| Subject | Re: Nested list collapsing script - THANKS |
|---|
| Date | 4 June 2005 11:35 |
|---|
Hi Mark (Tarquin)
Thanks, that worked perfectly, it compacts straight away. Thanks for
responding so soon, I really appreciate your help. As I said you'll get that
acknowledgement via a link back to your page from my credits page, once my
site is up and running.
About the plus / minus sign, I actually settled on preparing an up and down
arrow graphic and used Nisad Sivcevic's modified version of your script to
include images. I don't suppose you know how to get images to the right of
the text. Would I use the same bit of coding you supplied in your e-mail?
It's no biggy, I'm actually happy with the arrows on the left, but for
future reference it would be good to know.
Have a good weekend and thanks once again for a winner script. Hope you have
some joy with your ISP soon, I got another Failed Message from my first
reply to this email, so used the ntlworld.com address instead.
Regards
Antony