[Javascript] Dynamically Jump to Page Areas

Fri Oct 1 15:05:43 CDT 2004

Greetings Everyone,

   While I appreciate Flavio and Hakan's empty page additive suggestions, I've
decided a text highlighting method is best to better distinguish the selected
table item.  So what I think I need to do is dynamically reconstruct the page
each time an <area> tag of the <map> is selected.  The "new" page will of
course have the background/text color attributes reversed for the appropriate
item so as to make the item's text look highlighted.  More importantly the
window.location.href variable for the new page will need to be set to the name
attribute of the <a> tag which corresponds to the href attribute in the
selected area tag.

Since the description of this process is a little cryptic, let's try a visual:

<html>
  <SCRIPT language="JavaScript">
                      function goTo(String place) {
                            var l = new location();
                            l.href = place;
                            window.location.href = l.href;
                      }
  </SCRIPT>

  <img src="A_Graphic.jpg" usemap="#A_Map">
  <MAP NAME="A_Map">
    <area shape="RECT" onClick="goTo('Item1')" coords="26,94,112,188"
href="#Item1>
    <area shape="RECT" onClick="goTo('Item2')" coords="157,343,238,412"
href="#Item2">
                                    .
                                    .
                                    .(con'd)

  </MAP>

  <table>
    <tr>
      <td>
        <a name="Item1">First Item</a>
      </td>
      <td>
        <a name="Item2">Second Item</a>
      </td>
                      .
                      .
                      .(con'd)
    </tr>
  </table>
</html>

So at this point I'm not messing with the new page construction, I'm just trying
to get the document to duplicate the mapping functionality without using the
map object rather; using JavaScript.  When I open this HTML document, I get
that good 'ol "object expected" error when I click on any of the "areas".  The
areas are still recognized as links, though, since the icon changes when I
mouse over them.  Is there anyone who recognizes what I'm doing wrong here??

Thanks,
Tracy:-)