<?xml-stylesheet href="http://www.snee.com/xml/linking/1toM.xml" 
                 type="text/xsl" ?>
<!-- govtrack.us menus look like a promising replacement for the 
  popup menu code used here -->
<html>
  <head>
     <title>One-to-many Linking with the HTML a Element</title>
     <link href="http://www.snee.com/xml/linking/linkdemo.css"
           type="text/css" rel="stylesheet"/> 
  </head>
  <body>

<h1>One-to-many Linking with the HTML <tt>a</tt> Element</h1>

<p><i>Bob DuCharme, 2003-01-18</i></p>

<p>This demonstrates the use of nested <tt>a</tt> elements to
implement one-to-many links in HTML. Except for those links, this
document is regular XHTML. The referenced XSLT script, <a
href='1toM.xml'>1toM.xml</a>, copies everything verbatim but converts
nested <tt>a</tt> elements to JavaScript menu generation code that I
learned about from a <a
href='http://developer.netscape.com/viewsource/smith_menu/smith_menu.html'>Netscape
DevEdge</a> article. The XSLT script has a file extension of
<tt>xml</tt> because for now my hosting provider ships a file with an
extension of <tt>xsl</tt> with a MIME type of text/html, in which case
Mozilla doesn't know that it's a stylesheet to apply to the
document.</p>

<p>Compare the markup in the following paragraph (do a View Source to
see it) with the behavior of the links when you click them. The green
links are the one-to-many ones. This has been tested with Mozilla
1.2.1 and IE 6.0 from a Windows 98 box.</p>

<hr/>

<p>While the Recommendations for W3C specs such as 
<a href='http://www.w3.org/TR/xslt'>XSLT</a> and 
<a href='http://www.w3.org/TR/REC-CSS2'>CSS Level 2</a> 
fit in one document, more complex specs such as 

<a>W3C Schemas
  <a href='http://www.w3.org/TR/xmlschema-0/'>Part 0: Primer</a>
  <a href='http://www.w3.org/TR/xmlschema-1/'>Part 1: Structures</a>
  <a href='http://www.w3.org/TR/xmlschema-2/'>Part 2: Datatypes</a>
</a> 

and

<a>DOM Level 2

  <a href='http://www.w3.org/TR/DOM-Level-2-Core/'>Core Specification</a>
  <a href='http://www.w3.org/TR/DOM-Level-2-Events/'>Events Specification</a>
  <a href='http://www.w3.org/TR/DOM-Level-2-Style/'>Style Specification</a>
  <a href='http://www.w3.org/TR/DOM-Level-2-Traversal-Range/'>Traversal and Range Specification</a>
  <a href='http://www.w3.org/TR/DOM-Level-2-Views'>Views Specification</a>
</a> 

require multiple documents. It helps you appreciate the brevity of the
original <a href='http://www.w3.org/TR/REC-xml'>XML 1.0</a> spec, although
some would consider the <a
href='http://www.w3.org/TR/REC-xml-names'>Namespaces</a> spec to be a part of
that now.</p>

<hr/>

<p>Ideally, the same processing instruction of </p>

<pre>&lt;?xml-stylesheet href="http://www.snee.com/xml/linking/1toM.xml" type="text/xsl" ?>
</pre>

<p>at the top of your XHTML with nested <tt>a</tt> elements should
cause the same thing to happen. (The XSLT script doesn't make the
anchor text green, though; it assigns its <tt>a</tt> element to have a
<tt>class</tt> value of "multi", and my CSS stylesheet makes the
"multi" <tt>a</tt> elements green.) Let me know!</p>

<p>2003-01-19: It doesn't work in Netscape 7.01, according to the JavaScript console, because of a problem in the menu.js DevEdge JavaScript code (Error: document.body has no properties Source File: http://developer.netscape.com/viewsource/smith_menu2/menu.js Line: 94). If anyone else tries this with Mozilla or Netscape and it doesn't work, let me know what the JavaScript console (/Tools/Web Development/JavaScript Console) says.</p>

<p><i>bob&#64;snee.com<br/>
<a href='http://www.snee.com/bob'>http://www.snee.com/bob</a></i></p>


  </body>
</html>

