Re: [WSG] navigation using arrows for location

[Ben Curtis]

http://c41.com.au/test/sample_nav.gif
...
any ideas, wacky or otherwise, appreciated.

Always respect those wacky ideas.
Here's one:
What you would ideally have is an older-sibling, younger-sibling type 
selector. Then you could select all the li elements that are siblings 
and come before your active element, and give them a vertical line 
background or border. Then give your active element the arrow. And 
leave the younger-siblings (the siblings after your active element) 
alone.

CSS gives you child, descendent and sibling selectors, but no 
source-order selector like that. Dynamic css might give you a chance 
with nth-child selectors, but that's years off from being practice in 
public websites.

So, if you're not averse to calling down the wrath of the semantic 
gods, nest each element so you have a bunch of descendant selectors to 
work with. Instead of the nice and meaningful:

<ul>
<li>WoodCentre</li>
<li>250 Latin Street</li>
<li>El Changeo</li>
<li>2 Changed Ave</li>
<li>Changewood Facilities</li>
<li class="active">Active Project</li>
<li>Park in Perth</li>!
<li>11 Smith Street</li>
<li>58 &amp; 88 Changed St</li>
</ul>
...you would instead code it like this gob of meaningless gunk:
<div class="locationArrow">
<div>WoodCentre
<div>250 Latin Street
<div>El Changeo
<div>2 Changed Ave
<div>Changewood Facilities
<div class="active">Active Project
<div>Park in Perth<
<div>11 Smith Street
<div>58 &amp; 88 Changed St
</div>/div></div></div></div></div></div></div></div>
</div>
Then you could style it like this:
div.locationArrow div { background: transparent url(vert-line.gif) 0 0 
repeat-y; }
div.active { background: transparent url(arrow-thing.gif) 0 0 
no-repeat; }
div.active div { background:none; }

--
        Ben Curtis : webwright
        bivia : a personal web studio
        http://www.bivia.com
        v: (818) 507-6613

******************************************************
The discussion list for  http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************